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中有两种自加运算,其运算符均为 ++,功能为将运算符自 ...
随机推荐
- python全栈开发day14--内置函数和匿名函数
- Nginx 启动脚本,超级详细
转载自:https://www.cnblogs.com/leffss/p/7845303.html
- Python 动态生成多个变量
引用自:https://blog.csdn.net/u013061183/article/details/78015673 用Python循环创建多个变量, 如创建 a1= .a2= .a3= ...
- Spring日记_01 之 Maven搭建 - 阿里云镜像替换maven配置文件
# 项目环境搭建 ## 1. Eclipse + Maven 中央库太慢所以使用 阿里云镜像:maven.aliyun.com 1. 配置Aliyun Maven 仓库 导入配置文件 set ...
- 【值得收藏】一份非常完整的Mysql规范
做一个积极的人 编码.改bug.提升自己 我有一个乐园,面向编程,春暖花开! 本文从芋道源码转载,在原有内容基础上结合阿里巴巴Java开发手册中Mysql数据库章节的介绍,加上自己的理解和说明,整理而 ...
- Fibonacci Modified
题目来源:Fibonacci Modified We define a modified Fibonacci sequence using the following definition: Give ...
- 每日踩坑 2019-04-09 Web.config configuration 蓝色波浪线 未声明 configuration 标签的解决办法
百度看了几篇答案都没有给出解决方案,看了看 MSDN. https://docs.microsoft.com/zh-cn/previous-versions/ms228147(v=vs.110) 似乎 ...
- Springzz中使用监听器,用于容器一启动就加载准备数据(application范围内的数据,用于减轻服务器压力,不用每次都去查数据)
java代码: public class InitListener implements ServletContextListener { public void contextInitialized ...
- 107. 二叉树的层次遍历 II
107. 二叉树的层次遍历 II 题意 给定一个二叉树,返回其节点值自底向上的层次遍历. (即按从叶子节点所在层到根节点所在的层,逐层从左向右遍历). 解题思路 递归:利用前序遍历的思想,在递归过程中 ...
- Oracle 11g透明网关连接Sqlserver 2000(转)
Oracle 11g透明网关连接Sqlserver 2000: http://www.cnblogs.com/lightnear/archive/2013/02/03/2890858.html 透明网 ...