`
fuhao200866
  • 浏览: 79025 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

简析javascript的this

阅读更多

很小白的百度知道一下“javascript this”,搜到了这个:
http://zhidao.baidu.com/question/87695812.html?si=2
其中,网友tkocn的回答重点就是这段:(----没考证是原创还是引用)
定义:this是包含它的函数,作为方法被调用时所属的对象。
说明:这句话有点咬嘴,但一个多余的字也没有,定义非常准确,我们可以分3部分来理解它!
    1、包含它的函数。2、作为方法被调用时。3、所属的对象。
那就对这段发挥一下吧。
貌似这段话里“作为方法”这四个字可以去掉,改成这样:
定义:this是包含它的函数,在被调用时所属的对象。
说明:这句话有点咬嘴,但一个多余的字也没有,定义非常准确,我们可以分3部分来理解它!
    1、包含它的函数。2、在被调用时。3、所属的对象。
先看以下代码:

var dbl=function(n){
 this.dblValue=n*2;
 window.alert('n是几?'+n);
 window.alert('this是谁?'+this.name);
}


问题也就两个。
“n是几?”,很好解答:n是函数参数,调用函数时传几就是几。
“this是谁?”,其实也很好回答,this是主人,谁调用函数就是谁。
上面两个回答里都有“调用函数”,
那我们看下,通常调用函数会有哪些方式:

  dbl(1); //静态方式调用,看不到调用主人。this由js引擎决定,在浏览器里,粗略的当作window吧
  new dbl(2); //new 方式调用,会临时new出一个对象,并将this指向它。
  var jk={name:'JK'}; 
  jk.dbl=dbl;
  jk.dbl(3); //“.”方式调用。这一句很清楚啊,主人就是jk指针所对应的对象。因为在调用时,是通过jk.xx找到那个函数的。简而言之,就是“.”前面的对象
  dbl.call(jk,4); //因为this指向谁,是js引擎的潜规则(假设那咬嘴的定义我们明白不了)。所以js提供一些明规则,让我们指定“this”是谁。
  dbl.apply(jk,[5]); //类似于call。区别只是指定arguments的方式不一样。
  document.body.addEventListener('click',dbl);//然后点击document.body。//这也是一个典型代表:我们肉眼看不出浏览器是如何使用我们添加的监控,所以我们只那去找浏览器的相关文档。


明白了以上,那再看以下

var tom={name:'Tom',friend:jk};
tom.friend.dbl(6); //按第3条,主人是tom.friend
var Cls=function(name){
 this.name=name;
};
Cls.prototype.dbl=dbl;
Cls.prototype.dbl(7); //按第3条,主人是Cls.prototype
var jim=new Cls('Jim');
jim.dbl(6); //按第3条,主人是jim
var funX=function(n){
 dbl(n); //按第一条,主人是window
};


理解得差不多了吧。
不过,还没有。
还是回到这一句:“定义:this是包含它的函数,在被调用时所属的对象”
最后一个单词是“对象”,
dbl.call(null,11); //我想把this指定成null可以吗?----好像不可以哦,别人要的是对象啊,传null或undefined,就会被忽略。
dbl.call(1,12); //传一个值,可以吗?----可以传,但是最后跟你传进来的可能会有点差别:会把它转化成对应的对象。
执行一下以下代码看看效果:

var fun=function(){
    alert(['this是:'+this,'typeof结果:'+(typeof this),'constructor是:'+this.constructor,'this===window?:'+(this===window)].join('\n'));
}
var arr=[null,undefined,true,1,'hello',fun,{}];
for(var i=0;i<arr.length;i++) fun.call(arr[i]);

 

分享到:
评论

相关推荐

    简析JavaScript事件、以及捕获和冒泡

    JavaScript事件是Web开发中不可或缺的一部分,它允许用户与网页进行交互。事件驱动的编程模型使得JavaScript成为构建动态和响应式用户界面的理想选择。本文将深入探讨JavaScript事件机制,特别是事件的捕获和冒泡...

    javascript事件委托的用法及其好处简析.doc

    javascript事件委托的用法及其好处简析.doc

    javascript实现自动填写表单实例简析

    JavaScript 实现自动填写表单的知识点涵盖面很广,涉及到了前端页面元素的定位、JavaScript 的 DOM 操作,以及如何利用浏览器内置功能来方便地使用这些脚本。下面将详细解析这些知识点。 首先,页面元素定位是关键...

    Java中的泛型简析实战.zip

    Java中的泛型简析实战Java中的泛型简析实战Java中的泛型简析实战Java中的泛型简析实战Java中的泛型简析实战Java中的泛型简析实战Java中的泛型简析实战Java中的泛型简析实战Java中的泛型简析实战Java中的泛型简析实战...

    javascript大事托付的用法及其好处简析_.docx

    JavaScript中的“大事托付”(Delegation)是一种事件处理策略,它利用事件冒泡的特性来提高代码效率和性能。事件冒泡是指事件从最深的节点开始,然后逐级向上层元素传播事件。在大型或动态的DOM结构中,大事托付...

    JavaScript mapreduce工作原理简析

    JavaScript MapReduce工作原理简析 MapReduce是一种编程模型,由谷歌在2004年的OSDI会议上提出,它主要用于大规模数据集的并行处理。该模型借鉴了函数式编程的概念,将复杂的数据处理任务分解为两个主要阶段:Map...

    嘉世咨询2024休闲食品行业简析报告.pdf

    【嘉世咨询】2024休闲食品行业简析报告.pdf【嘉世咨询】2024休闲食品行业简析报告.pdf【嘉世咨询】2024休闲食品行业简析报告.pdf【嘉世咨询】2024休闲食品行业简析报告.pdf【嘉世咨询】2024休闲食品行业简析报告.pdf...

    嘉世咨询2024智能音箱市场简析报告.pdf

    【嘉世咨询】2024智能音箱市场简析报告.pdf【嘉世咨询】2024智能音箱市场简析报告.pdf【嘉世咨询】2024智能音箱市场简析报告.pdf【嘉世咨询】2024智能音箱市场简析报告.pdf【嘉世咨询】2024智能音箱市场简析报告.pdf...

    STL简析入门基础学习

    STL简析STL简析STL简析基础学习STL简析基础学习STL简析基础学习STL简析基础学习STL简析基础学习STL简析基础学习

    嘉世咨询:2024中医药行业简析报告(1).pdf

    嘉世咨询:2024中医药行业简析报告(1).pdf

    简析 createDelegate

    上下文通常指的是执行代码时的环境,例如哪个对象调用了这个方法,这就是`this`关键字在JavaScript中的作用。 `createDelegate`函数的主要功能是创建一个新的函数,当这个新函数被调用时,它会确保内部调用的原始...

    Web3.0概念下的场景生态简析.pdf

    Web3.0概念下的场景生态简析 Web3.0概念是指下一代互联网的发展方向,旨在解决用户与用户之间的信息互动、提升信息的传递效率、实现信息交互过程中的“可信”与“沉浸”。在当下,Web3.0概念受到关注的原因来自于现...

    UBIFS文件系统简析

    UBIFS文件系统是针对FLASH存储介质设计的一种日志结构文件系统,它专门为嵌入式系统中的高性能、低能耗、无机械器件的需求而设计。UBIFS能够有效地利用FLASH的空间和提升数据处理速度,同时还能减少写入放大(Write ...

    android descendantFocusability用法简析

    android descendantFocusability用法简析

    《我-机器人》简析.pptx

    《我-机器人》简析全文共36页,当前为第1页。 《我-机器人》简析全文共36页,当前为第2页。 《我-机器人》简析全文共36页,当前为第3页。 《我-机器人》简析全文共36页,当前为第4页。 《我-机器人》简析全文共36页...

    LIN总线系统简析.ppt

    LIN总线系统简析

    Android PhoneGap简析

    PhoneGap的实现核心是WebView与JavaScript的交互机制,通常通过`addJavascriptInterface`方法暴露Java对象到JavaScript环境中,使得JS能够调用Android原生方法。同时,PhoneGap也提供了一套JavaScript API,简化了跨...

Global site tag (gtag.js) - Google Analytics