js中call和apply的作用和用法

call和apply的用途是完全一样的。改变函数中this的指向：

为什么要改变this的指向呢？这个有什么用？有哪些场景呢？

首先this的指向总是在变的，this的指向是由函数执行时所在的环境决定的，而不是函数声明时的环境。

this都指向哪里？

1、在控制台中输入下面的代码，此时可以看到this指向a这个对象。

var a={name:'a',getName:function(){return this.name;}
}
console.info(a.getName());//a

2、此时this指向了window

window.name= 'window';
var a={name:'a',getName:function(){return this.name;}
}var b = a.getName;
console.info(b());//window

结论：

如果函数是作为一个对象的属性被调用的（用点的方式调用），此时函数内的this就指向这个对象。

如果是用变量或者名称的方式直接调用的（不是使用点调用），则指向window。

场景：

this的改变：在写代码时经常会遇到这种情况，将函数作为回调函数使用时，this的指向变为了window，这个不是我们预期的结果

window.name='window';
var a={name:'a',getName:function(callback){return callback();//funcB使用非对象.的方式调用},funcB:function(){return this.name;}
}
console.info(a.getName(a.funcB));//window

这个时候就可以用call或者apply把this传递到callback中，callback中的this的指向就会被传入的this所替代。

当然，也可以传入其他对象覆盖当前this的指向。

window.name='window';
var b={name:'b'
};
var a={name:'a',getName:function(callback){return callback.call(b);//传入b
    },funcB:function(){return this.name;}
}
console.info(a.getName(a.funcB));//b

也可以借用这个对象的方法。

window.name='window';
var b={name:'b',    getBName:function(){return this.name;}
};
var a={name:'a',getName:function(callback){return callback.call(b);//传入b
    },funcB:function(){return this.getBName();}
}
console.info(a.getName(a.funcB));//b

使用这个功能可以实现类似继承的效果

var  F=function(name){this.name = name;
}
var S = function(){this.age=arguments[1];F.apply(this,arguments);
}
S.prototype.getNameAndAge=function(){console.info('名字是'+this.name+'年龄是'+this.age);
}var s = new S('小红','9岁');
s.getNameAndAge();//名字是小红年龄是9岁

call和apply的区别：

传入的参数形式不一样

call(obj，参数1，参数2)；

apply(obj，[参数1，参数2])；

转载于:https://www.cnblogs.com/panyujun/p/9367911.html

js中call和apply的作用和用法相关推荐

js中的匿名函数的作用以及用法讲解
匿名函数顾名思义指的是没有名字的函数,在实际开发中使用的频率非常高!也是学好JS的重点. 释义:匿名函数,就是没有实际名字的函数. 小试牛刀,首先我们声明一个普通函数: //声明一个普通函数,函数的名 ...
JS 中 call()、apply()、bind() 的用法
其实是一个很简单的东西,认真看十分钟就从一脸懵B 到完全理解! 先看明白下面: 例 1 obj.objAge; // 17obj.myFun() // 小张年龄 undefined 例 2 show ...
js中的波浪线符号作用（按位非（~）符号）
js中的波浪线符号作用(按位非(~)符号) 一.输入为正数(1和2) 二.输入为负数(-1,-2) Javascript 按位取反运算符 (~) ,对一个表达式执行位非(求非)运算.如 ~1 = -2 ...
return true Java_[Java教程]js中return,return true,return false的用法及区别
[Java教程]js中return,return true,return false的用法及区别 0 2015-11-16 23:00:03 1.语法及返回方式 ①返回控制与函数结果语法为:retu ...
javascript中call和apply的区别和用法
javascript中call和apply的区别和用法 1.call和apply是什么更改对象的内部指针指向,即改变对象的this指向的内容 function Fn(){this.name='小明' ...
chrome中Blackbox Script 黑盒脚本作用及用法
chrome中Blackbox Script 黑盒脚本作用及用法 Blackbox Script功能每天前端人员在调试代码的时候,都可能会遇到代码调试着会进入第三方库文件,带来很多没必要的调试,不方 ...
js中几个对象的区别和用法
js中几个对象的区别和用法今天总结一下js中几个对象的区别和用法: 首先来说说 parent.window与top.window的用法 "window.location.href" ...
javascript 中 caller 与 callee 的作用以及用法
这两个关键字在平时编码中几乎难以用到,但它们既然存在于javascript语言体系中,那么还是有必要了解下. caller 是 javascript 函数类型的一个属性,它引用调用当前函数的函数 fu ...
js中parentNode和parentElement的区别和用法
了解本篇的基础必须知道什么是节点,关于html dom节点知识点和节点类型的知识,分别看<js节点都有哪些类型?怎么判断是哪种节点类型?>和<js属性节点获取和移除>,下面直接 ...

js中call和apply的作用和用法

js中call和apply的作用和用法相关推荐

最新文章

热门文章