javaScript中的this示例学习详解及工作原理
更新时间：2014年01月13日 09:39:54 作者：
这篇文章主要介绍了javaScript中的this示例学习详解及工作原理，大家参考使用吧
this的工作原理
如果一个函数被作为一个对象的方法调用，那么this将被指派为这个对象。
复制代码 代码如下:
var parent = {
method: function () {
console.log(this);
}
};
parent.method();
// <- parent
注意这种行为非常“脆弱”，如果你获取一个方法的引用并且调用，那么this的值不会是parent了，而是window全局对象。这让大多数开发者迷惑。
复制代码 代码如下:
ThisClownCar();
// <- Window
改动this
.call、 .apply 和.bind 方法用来操作调用函数的方式，帮我们定义this的值和传递给函数的参数值。
Function.prototype.call 可以有任意数量的参数，第一个参数被分配给this，剩下的被传递给调用函数。
复制代码 代码如下:
Array.prototype.slice.call([1, 2, 3], 1, 2)
// <- [2]
Function.prototype.apply 的行为和.call类似，但它传递给函数的参数是一个数组，而不是任意参数。
String.prototype.split.apply('13.12.02', ['.'])
// <- ['13', '12', '02']
Function.prototype.bind 创建一个特殊的函数，该函数将永远使用传递给.bind的参数作为this的值，以及能够分配部分参数，创建原函数的珂里化（curride）版本。
复制代码 代码如下:
var arr = [1, 2];
var add = Array.prototype.push.bind(arr, 3);
// effectively the same as arr.push(3)
add();
// effectively the same as arr.push(3, 4)
add(4);
console.log(arr);
// <- [1, 2, 3, 3, 4]
作用域链中的this
在下面的例子，this将无法在作用域链中保持不变。这是规则的缺陷，并且常常会给业余开发者带来困惑。
复制代码 代码如下:
function scoping () {
console.log(this);
return function () {
console.log(this);
};
}
scoping()();
// <- Window
// <- Window
有一个常见的方法，创建一个局部变量保持对this的引用，并且在子作用域中不能有同命变量。子作用域中的同名变量将覆盖父作用域中对this的引用。http://www.cnblogs.com/sosoft/
复制代码 代码如下:
function retaining () {
var self = this;
return function () {
console.log(self);
};
}
retaining()();
// <- Window
除非你真的想同时使用父作用域的this,以及当前this值，由于某些莫名其妙的原因,我更喜欢是使用的方法.bind函数。这可以用来将父作用域的this指定给子作用域。
复制代码 代码如下:
function bound () {
return function () {
console.log(this);
}.bind(this);
}
bound()();
// <- Window
相关文章
本篇文章给大家总结了JavaScript在IE9之前版本中内存泄露问题，对此有兴趣的朋友可以学习下。2018-04-04
这篇文章主要介绍了多个javascript闭包入门示例，理解了这几个例子，对于闭包，应该可以算是入门了,需要的朋友可以参考下2014-04-04
这篇文章主要针对javascript中递归函数用法注意点做介绍，有需要小伙伴可以来学习下2015-07-07
如果在使用javascript的时候涉及到event处理，就需要知道event在不同的浏览器中的差异，主要的JavaScript的事件模型有三种（参考《Supporting Three Event Models at Once》），它们分别是NN4、IE4+和W3C/Safar。2014-06-06
JavaScript高级程序设计（第3版）学习笔记3 js简单数据类型
数据类型是编程语言的砖瓦，是所有你能想象到的复杂抽象的基础，在现代编程语言中，除了语言本身内置的一些简单数据类型外，基本上都提供了用于自定义数据类型的语言机制（在C中也可以利用结构体来实现），这些机制在一定程度上也决定了该语言的流行度和生命力2012-10-10
这篇文章主要介绍了JavaScript中将数组进行合并的基本方法讲解,包括快速合并多个数组的方法,需要的朋友可以参考下2016-03-03
这篇文章主要介绍JavaScript编程中的对象概念,也是JS面向对象编程的基础知识,需要的朋友可以参考下2015-10-10
javascript Window及document对象详细整理
注:页面上元素name属性以及JavaScript引用的名称必须一致包括大小写否则会提示你1个错误信息 引用的元素为空或者不是对象2011-01-01
本文介绍了javascript中的5个原始值（数字，字符，布尔，null,undefined），6个typeo能判断（数字，字符，布尔，object,function,undefined）以及9个原生的内置构造函数，是篇非常不错的文章，这里推荐给大家。2014-11-11
这篇文章主要介绍了JavaScript中循环遍历Array与Map的各种方法,利用的都是js入门学习中的基础知识,需要的朋友可以参考下2016-03-03
最新评论