Javascript中的这个关键字使用详细的解决方案。
如果函数被function.call或function.apply,那么这个点的呼叫/第一个参数应用。如果参数为null或未定义,则指向全局对象(在浏览器中,全局对象是窗口对象)。
如果函数称为Function.bind,那么这将指向第一个参数(绑定方法时创建的)。
如果函数被对象作为方法调用,则指向对象。
如果函数被称为作为函数的光滑函数,它不属于任何对象,那么这指向全局变量窗口。
功能
首先,让我们来看看函数:
函数引入(){
警报(你好,我是laruence R;
}
对于这个函数,这个关键字指向谁
函数被定义为一个全局函数,函数的所有者是当前页面,也就是窗口对象。
这就是为什么我用引号来引导函数的原因,因为全局函数的定义实际上是窗口对象的一种方法。
所以我们可以直接通过函数名或窗口调用。方法名称。此时,该方法中的关键字引用其所有者:窗口对象。
如果我们查看窗口的引入属性,我们得到以下内容:
变量名=我laruence ;
函数引入(){
警报(这个名字);
}
警报(窗口,介绍);
*输出:
*函数引入(){
*警报(此名称);
* }
* /
如果你看上面的代码,你可能会认为既然全球功能是窗口对象的方式,和全局变量的属性窗口对象(的JavaSript范围已经提到),那么我们可以通过这个关键词在全局函数访问全局变量。
答案是肯定的,如果你打电话给介绍的功能,你会发现我是Laruence。
事件处理函数
也许,这个关键字混乱的原因大部分是因为在事件处理中使用了函数(方法)。
例如,我们现在需要单击名称输入框并显示值。在名称输入框中,您可以编写以下代码:
功能showvalue(){
警报(这个值);
}
document.getelementbyid('name')。Onclick = showvalue;
上面的代码正常运行,但为什么这并不意味着这个函数指针总是指向函数拥有者,这并不意味着全局变量的所有者是窗口对象吗
好吧,如果你能想到这个问题,那就意味着你在认真地看我的文章,否则,我建议你从头开始看,否则你仍然困惑。
嗯,是的,上述代码,showvalue是全局对象定义,如此看来,这个问题只能发生在onclick事件绑定时间。
正如我们所知道的,在js中,所有事物都是对象,函数和方法也是对象属性,但是函数在可执行文件中有属性。所以,上述代码,当处理器onclick绑定,ID为onclick属性赋值名称输入框的DOM对象。
这是我们给showvalue复制功能的名称输入框对象的onclick属性。如果我们看看onclick:此时
功能showvalue(){
警报(这个值);
}
document.getelementbyid('name')。Onclick = showvalue;
警报(document.getelementbyid('name')。Onclick);
*输出
*功能showvalue(){
*警报(此值);
* }
* /
所以,当事件被触发时,该名称输入框onClick方法被调用,此时这个关键词自然是指向名称输入框。
但令人困惑的事情出现了,例如:
功能showvalue(){
警报(这个值);
}
它不能正常工作,这就是原因。
因为在这个时候,这不是一个作业,而是一个参考。
如果我们注意到两个onclick写作,你会发现,以往的方法,我们使用:
dom.onclick = showvalue; / /没有调用操作符
对于刚才的方法:
onclick=showvalue() / /电话。
这也可以反映出双方的区别:前者是赋值,后者是引用。如果我们看看此时的输入框的onclick属性,我们可以得到:
警报(DOM。onclick);
*输出:
*函数onClick(){
* showvalue();
* }
* /
看出差异并理解原因
这里有一个非常有趣的例子,可以在IE下试用:
改变这个方向
好了,既然我们知道为什么了,我们怎么能把这一点指向我们想要指出的呢
对于上面的事件处理函数,我们可以编写以下方法:
dom.onclick = showvalue();
Dom.onclick =函数(){ alert(这个值);}
我们只是想一下,这是如何嵌入句子的。
Dom.addEventListener(DOM,showvalue,false); / / FF只有
对于不是事件处理函数的场合,我们可以使用应用或调用来更改该关键字的方向。
例如:
VaR laruence = { {
名称:'laruence,
年龄:26岁,
职位:高级PHP工程师,
公司:'baidu公司。
};
函数引入(){
警报(这个名字);
}
introduce.call(laruence);
一个被称为Function.call函数的一个例子:
VaR MyObject = { {
SayHello:函数(){
console.log(嗨!我的名字是这个名字);
},
MyName:'rebecca
};
无功secondobject = { {
MyName:'colin
};
(MyObject。sayHello); / / logs'hi我的名字是丽贝卡!
myobject.sayhello.call(secondobject); / / logs'hi我的名字是柯林!
这个函数被称为Function.call的例子:
我=全局对象的功,
sayHello =函数(){
console.log(嗨!我的名字是这个名字);
},
MyObject = { {
MyName:'rebecca
};
无功myobjecthello = sayhello.bind(MyObject);
(打招呼); / / logs'hi我的名字是全局对象!
(myobjecthello); / / logs'hi我的名字是丽贝卡!
对象调用的函数的一个示例:
我=全局对象的功,
sayHello =函数(){
console.log(嗨!我的名字是这个名字);
},
MyObject = { {
MyName:'rebecca
},
secondobject = { {
MyName:'colin
};
myobject.sayhello =打招呼;
secondobject.sayhello =打招呼;
(打招呼); / / logs'hi我的名字是全局对象!
(MyObject。sayHello); / / logs'hi我的名字是丽贝卡!
(secondobject。sayHello); / / logs'hi我的名字是柯林!
当在一个非常深的命名空间中调用函数时,我们通常会缓存一个指向要调用的函数的变量,以减少代码量,但这将在函数中改变这个值,并最终执行错误的操作:
无功mynamespace = { {
myObject: {
SayHello:函数(){
console.log(嗨!我的名字是这个名字);
},
MyName:'rebecca
}
};
VaR你好= mynamespace.myobject.sayhello;
(你好); / / logs'hi我的名字是未定义的!
因此,为了缓存变量来保存代码,正确的方法是只保存调用该函数的对象。
无功mynamespace = { {
myObject: {
SayHello:函数(){
console.log(嗨!我的名字是这个名字);
},
MyName:'rebecca
}
};
var obj = mynamespace.myobject;
(obj。sayHello); / / logs'hi我的名字是丽贝卡!
总之,有一个大道理:谁管那个功能,这指谁。