首页 > 代码库 > javascript高级知识分析——上下文
javascript高级知识分析——上下文
如果函数是一个对象的属性，那么它可以？
var katana = { isSharp: true, use: function(){ this.isSharp = !this.isSharp; } }; katana.use(); console.log( katana.isSharp );//false;
在javascript中，函数的内部，this默认指向调用它的对象。本例katana.use()，函数use被对象katana调用，所以在函数内部，this.isSharp可以操作katana.isSharp。
函数通过this引用的对象，就是上下文。
上下文到底代表什么？
function katana(){ this.isSharp = true; } katana(); console.log( isSharp === true, "特殊情况，全局变量的简写方式，this可以引用window对象的属性，" ); var shuriken = { toss: function(){ this.isSharp = true; } }; shuriken.toss(); console.log( shuriken.isSharp === true, "函数this引用调用它的对象" );
katana()=window.katana()，这个例子很明确的显示函数内部的this指向调用它的对象，这就是上下文。
函数的上下文是否可以改变？
var object = {}; function fn(){ return this; } console.log( fn() == this, "上下文是全局对象" ); //trueconsole.log( fn.call(object) == object, "上下文被改为指定对象" ); //true
call的用法，修改函数的上下文this为第一个参数。
改变上下文的不同方法：
function add(a, b){ return a + b; } console.log( add.call(this, 1, 2) == 3, ".call() 参数为多个" ); //trueconsole.log( add.apply(this, [1, 2]) == 3, ".apply() 参数为一个数组" ); //true
call和apply经常用来修改上下文，它们功能完全一样，只有一个区别：一个接收多个独立参数，一个接收单个数组作参数。
习题：补足代码，在回调函数里完成数组遍历
function loop(array, fn){ for ( var i = 0; i < array.length; i++ ) { // 补足代码 } } var num = 0; loop([0, 1, 2], function(value){ console.log(value == num++, "确保上下文为我们希望的."); console.log(this instanceof Array, "上下文是数组实例"); });
解决数组遍历的一个方法
function loop(array, fn){ for ( var i = 0; i < array.length; i++ ) { fn.call( array, array[i], i ); } } var num = 0; loop([0, 1, 2], function(value){ console.log(value == num++, "确保上下文为我们希望的."); console.log(this instanceof Array, "上下文是数组实例"); });
javascript高级知识分析——上下文
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。