javascript中的this在不同场景下的区别
javascript在初版的设计上存在失误,导致了这门语言在使用时,经验型写法并不能得到像其它几个流行语言一样预期。其中的this的使用就是一个典型。
this在javascript中是由解释器注入的,并且在我们使用不同的方法定义函数时,注入的this含义不同。以下是crokford总结的四类情况。
如果你使用闭包时总是结果不如预期,又或者返回NaN 或 undefined ,那请注意参看本文。
0. 构造器函数内的this:
如果函数创建的目的是使用new来调用,并产生一个对象,那么此函数被称为 构造器函数。
var Niu = function (string) {
this.name = string;
};
上述的Niu即为一个构造器函数,其内部的this会自动绑定到new所创建的新对象上面。
1. 对象成员方法内的this:
对象的成员方法中的this是对象本身,此时跟其它语言是一致的,但是也有差异,javascript中this到对象的绑定发生在函数调用的时候。
var myObj = {
value: 0,
increment: function (inc) {
this.value += typeof inc === 'number' ? inc : 1;
}
};
myObj.increment(); //1
myObj.increment(2); //3
2. 普通函数 与 闭包内的this:
2.1 以普通方式定义的函数中的this:会被自动绑定到全局对象。
var value = 232;
function toStr()
{
console.log("%d", this.value); //232
}
2.2 对象方法中闭包函数的this:
由2.1可知,在以普通方式定义的函数中的this会被自动绑定到全局对象上,大家应该可以看出闭包函数定义也与普通方式无异,因此他也会被绑定到全局对象上。
value = 10;
var closureThis = {
value: 0,
acc: function ()
{
var helper = function ()
{
this.value += 2;
console.log("this.value : %d", this.value);
}
helper();
}
}; closureThis.acc(); //12
closureThis.acc(); //14 var closureThat = {
value: 0,
acc: function ()
{
that = this;
var helper = function ()
{
that.value += 2;
console.log("that.value : %d", that.value);
}
helper();
}
}; closureThat.acc(); // 2
closureThat.acc(); // 4
从上述输出值可以看出,上述描述的正确性。
3. Apply函数的参数this:
appy方法允许我们选择一个this值作为第一个参数传递,第二个参数是一个数组,表明可以传递多个参数。
javascript中的this在不同场景下的区别的更多相关文章
- JavaScript 中定义变量时有无var声明的区别
关于JavaScript中定义变量时有无var声明的区别 var a=5; //正确 a=5; //正确 在javascript中,以上两种方法都是定义变量的正确方法.微软的Script56.CHM中 ...
- JavaScript中querySelector()和getElementById()(getXXXByXX)的区别
在日常开发中,使用JavaScript获取元素的时候,最常用的方法就是document.getElementById(getXXXByXX)方法.但是最近发现有很多地方使用的是querySelecto ...
- IOS5中的Safari不兼容Javascript中的Date问题,做下笔录吧!奶奶的,折腾我半天!
在做Mobile终端的Website开发中,我遇到一个很懊恼的问题. 在IOS5以上版本(不包含IOS5)中的Safari浏览器能正确解释出Javascript中的 new Date('2013-10 ...
- JavaScript中instanceof与typeof运算符的用法及区别详细解析
JavaScript中的instanceof和typeof常被用来判断一个变量是什么类型的(实例),但它们的使用还是有区别的: typeof 运算符 返回一个用来表示表达式的数据类型的字符串. typ ...
- javaScript中的return,break,continue的区别
导语: javaScript中有三种方法可以跳出循环或者终止循环.分别为break.return.continue. 正文: 一.break break 会使得整个程序终止执行或者包含了最内层的循环或 ...
- JavaScript中的三种弹出框的区别与使用
JavaScript中有三种原生的弹出框,分别是alert.confirm.prompt.分别表示弹出框.确认框.信息框. 以下是示例代码: <!DOCTYPE html> <htm ...
- JavaScript中的call 和apply的用途以及区别
apply 接受两个参数,第一个参数指定了函数体内this 对象的指向,第二个参数为一个带下标的集合,这个集合可以为数组,也可以为类数组,apply 方法把这个集合中的元素作为参数传递给被调用的函数: ...
- Javascript中call方法和apply方法用法和区别
第一次在博客园上面写博客,知识因为看书的时候发现了一些有意思的知识,顺便查了一下资料,就发到博客上来了,希望对大家有点帮助. 连续几天阅读<javascript高级程序设计>这本书了,逐渐 ...
- 在JavaScript中,++在前和++在后有什么区别
一.++可以与输出语句写在一起,++写在变量前和写在变量后不是一个意思++ i 和 i ++ 区别在于运算顺序和结合方向. 在JavaScript中有两种自加运算,其运算符均为 ++,功能为将运算符自 ...
随机推荐
- Mysql 双主架构配置从复制
引用自:https://blog.csdn.net/deeplearnings/article/details/78398526 https://www.cnblogs.com/ygqygq2/p/6 ...
- Adobe Acrobat Pro DC破解
下载amtemu 点击 在AMT Emulator界面,下拉选择Adobe Acrobat DC; 然后点击右下角Install安装破解补丁. 点击Install后在弹出窗口中手动找到并选择软件安装目 ...
- Unity 脚本中的主要函数的 执行顺序及其介绍
Awake ->OnEable-> Start -> FixedUpdate-> Update -> LateUpdate ->OnGUI ->OnDisa ...
- iOS 技术篇: 如何利用dsym文件分析苹果被拒日志
今天提审被拒了.伤心
- 打开Word时出现“The setup controller has encountered a problem during install. Please ...”
找到C:\Program Files\Common Files\Microsoft Shared\OFFICE12\Office Setup Controller,将这个文件夹删除或改名,就不再出现提 ...
- Visual Studio 2017 版本 15.5.5
Visual Studio 2017 版本 15.5.5 已修复的问题 (1)Xamarin 应用会引发“Cannot access a disposed object. Object name: ' ...
- adblock 下载地址
addblock 的作用: 防止追踪.恶意域名,过滤横幅广告.弹窗广告以及视频广告. 用以支持网站的非侵入式广告将不会被屏蔽 下载地址:https://pan.baidu.com/share/li ...
- 喵哈哈村的魔法考试 Round 16 (Div.2) 比赛题解
A 实际上我们for一遍就好. 坑点就是会爆int #include<bits/stdc++.h> using namespace std; const int maxn = 1e5+7; ...
- linux系统下shell命令中的sleep
在有的shell(比如linux中的bash)中sleep还支持睡眠(分,小时)sleep 1 睡眠1秒sleep 1s 睡眠1秒sleep 1m 睡眠1分sleep 1h 睡眠1 ...
- Structured Streaming教程(3) —— 与Kafka的集成
Structured Streaming最主要的生产环境应用场景就是配合kafka做实时处理,不过在Strucured Streaming中kafka的版本要求相对搞一些,只支持0.10及以上的版本. ...