源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

javaScript中的this示例学习详解及工作原理

  • 时间:2021-04-24 15:36 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:javaScript中的this示例学习详解及工作原理
[b]this的工作原理[/b] 如果一个函数被作为一个对象的方法调用,那么this将被指派为这个对象。
[u]复制代码[/u] 代码如下:
var parent = {     method: function () {         console.log(this);     } }; parent.method(); // <- parent
注意这种行为非常“脆弱”,如果你获取一个方法的引用并且调用,那么this的值不会是parent了,而是window全局对象。这让大多数开发者迷惑。
[u]复制代码[/u] 代码如下:
ThisClownCar(); // <- Window  
改动this .call、 .apply 和.bind 方法用来操作调用函数的方式,帮我们定义this的值和传递给函数的参数值。 Function.prototype.call 可以有任意数量的参数,第一个参数被分配给this,剩下的被传递给调用函数。
[u]复制代码[/u] 代码如下:
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)版本。  
[u]复制代码[/u] 代码如下:
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将无法在作用域链中保持不变。这是规则的缺陷,并且常常会给业余开发者带来困惑。
[u]复制代码[/u] 代码如下:
function scoping () {   console.log(this);   return function () {     console.log(this);   }; } scoping()(); // <- Window // <- Window
有一个常见的方法,创建一个局部变量保持对this的引用,并且在子作用域中不能有同命变量。子作用域中的同名变量将覆盖父作用域中对this的引用。http://www.cnblogs.com/sosoft/
[u]复制代码[/u] 代码如下:
function retaining () {   var self = this;   return function () {     console.log(self);   }; } retaining()(); // <- Window  
除非你真的想同时使用父作用域的this,以及当前this值,由于某些莫名其妙的原因,我更喜欢是使用的方法.bind函数。这可以用来将父作用域的this指定给子作用域。  
[u]复制代码[/u] 代码如下:
function bound () {   return function () {     console.log(this);   }.bind(this); } bound()(); // <- Window
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部