Javascript call和apply区别及使用方法


Posted in Javascript onNovember 14, 2013

一、方法的定义
call方法:
语法:fun.call(thisArg[, arg1[, arg2[, ...]]])
定义:调用一个对象的一个方法,以另一个对象替换当前对象。
说明:
call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisArg 指定的新对象。
如果没有提供 thisArg参数,那么 Global 对象被用作 thisArg。

apply方法:
语法:fun.apply(thisArg[, argsArray])
定义:应用某一对象的一个方法,用另一个对象替换当前对象。
说明:
如果 argArray 不是一个有效的数组或者不是 arguments 对象,那么将导致一个 TypeError。
如果没有提供 argArray 和 thisArg 任何一个参数,那么 Global 对象将被用作 thisArg, 并且无法被传递任何参数。

二、两者区别
两个方法基本区别在于传参不同
2.1、call方法:

function Product(name, price) {
this.name = name;
this.price = price;
if (price < 0)
throw RangeError('Cannot create product "' + name + '" with a negative price');
return this;
}
function Food(name, price) {
Product.call(this, name, price);
this.category = 'food';
}
Food.prototype = new Product();
function Toy(name, price) {
Product.call(this, name, price);
this.category = 'toy';
}
Toy.prototype = new Product();
var cheese = new Food('feta', 5);
var fun = new Toy('robot', 40);

2.2、apply方法:
function Product(name, price) {
this.name = name;
this.price = price;
if (price < 0)
throw RangeError('Cannot create product "' + name + '" with a negative price');
return this;
}
function Food(name, price) {
Product.apply(this, arguments);
this.category = 'food';
}
Food.prototype = new Product();
function Toy(name, price) {
Product.apply(this, arguments);
this.category = 'toy';
}
Toy.prototype = new Product();
var cheese = new Food('feta', 5);
var fun = new Toy('robot', 40);

三、作用实例

3.1、类的继承

function Person(name,age){
this.name = name;
this.age=age;
this.alertName = function(){
alert(this.name);
}
this.alertAge = function(){
alert(this.age);
}
}
function webDever(name,age,sex){
Person.call(this,name,age);
this.sex=sex;
this.alertSex = function(){
alert(this.sex);
}
}
var test= new webDever(“设计蜂巢”,24,”男”);
test.alertName();//设计蜂巢
test.alertAge();//24
test.alertSex();//男

3.2、回调函数
function Album(id, title, owner_id) {
this.id = id;
this.name = title;
this.owner_id = owner_id;
};
Album.prototype.get_owner = function (callback) {
var self = this;
$.get(‘/owners/' + this.owner_id, function (data) {
callback && callback.call(self, data.name);
});
};
var album = new Album(1, ‘设计蜂巢', 2);
album.get_owner(function (owner) {
alert(‘The album' + this.name + ‘ belongs to ‘ + owner);
});
Javascript 相关文章推荐
Javascript 学习书 推荐
Jun 13 Javascript
更优雅的事件触发兼容
Oct 24 Javascript
JavaScript中this关键词的使用技巧、工作原理以及注意事项
May 20 Javascript
JavaScript中对象property的读取和写入方法介绍
Dec 30 Javascript
Javascript将字符串日期格式化为yyyy-mm-dd的方法
Oct 27 Javascript
js无提示关闭浏览器窗口的两种方法分析
Nov 06 Javascript
全面解析node 表单的图片上传
Nov 21 Javascript
微信小程序实现MUI数字输入框效果
Jan 31 Javascript
详解Angular6 热加载配置方案
Aug 18 Javascript
微信小程序使用component自定义toast弹窗效果
Nov 27 Javascript
用Cordova打包Vue项目的方法步骤
Feb 02 Javascript
原生js实现俄罗斯方块
Oct 20 Javascript
javascript 上下banner替换具体实现
Nov 14 #Javascript
javascript scrollTop正解使用方法
Nov 14 #Javascript
简单的Jquery遮罩层代码实例
Nov 14 #Javascript
Extjs改变树节点的勾选状态点击按钮将复选框去掉
Nov 14 #Javascript
javascript loadScript异步加载脚本示例讲解
Nov 14 #Javascript
MyEclipse取消验证Js的两种方法
Nov 14 #Javascript
使用JS CSS去除IE链接虚线框的三种方法
Nov 14 #Javascript
You might like
微博短链接算法php版本实现代码
2012/09/15 PHP
php中JSON的使用与转换
2015/01/14 PHP
thinkphp多表查询两表有重复相同字段的完美解决方法
2016/09/22 PHP
ThinkPHP+EasyUI之ComboTree中的会计科目树形菜单实现方法
2017/06/09 PHP
找到了一篇jQuery与Prototype并存的冲突的解决方法
2007/08/29 Javascript
JQuery this 和 $(this) 的区别
2009/08/23 Javascript
JQuery1.8 判断元素是否绑定事件的方法
2014/07/10 Javascript
JavaScript限定图片显示大小的方法
2015/03/11 Javascript
BootStrap Table 设置height表头与内容无法对齐的问题
2016/12/28 Javascript
JavaScript 数据类型详解
2017/03/13 Javascript
Angular模板表单校验方法详解
2017/08/11 Javascript
js实现1,2,3,5数字按照概率生成
2017/09/12 Javascript
JavaScript中this关键字用法实例分析
2018/08/24 Javascript
详解微信小程序支付流程与梳理
2019/07/16 Javascript
JS自定义对象创建与简单使用方法示例
2020/01/15 Javascript
Vuex模块化应用实践示例
2020/02/03 Javascript
es6函数之rest参数用法实例分析
2020/04/18 Javascript
AutoJs实现刷宝短视频的思路详解
2020/05/22 Javascript
[02:03]《现实生活中的DOTA2》—林书豪&DOTA2职业选手出演短片
2015/08/18 DOTA
使用Python导出Excel图表以及导出为图片的方法
2015/11/07 Python
用Python实现斐波那契(Fibonacci)函数
2016/03/25 Python
numpy matrix和array的乘和加实例
2018/06/28 Python
linux环境中没有网络怎么下载python
2019/07/07 Python
python 函数的缺省参数使用注意事项分析
2019/09/17 Python
Python PyPDF2模块安装使用解析
2020/01/19 Python
MxNet预训练模型到Pytorch模型的转换方式
2020/05/25 Python
Python新手如何进行闭包时绑定变量操作
2020/05/29 Python
html5 figure和figcaption的使用方法
2018/09/10 HTML / CSS
草莓网中国:StrawberryNet中国
2020/08/17 全球购物
英国时尚首饰品牌:Missoma
2020/06/29 全球购物
华美博弈C/VC工程师笔试试题
2012/07/16 面试题
2015年学校办公室工作总结
2015/05/26 职场文书
2016年党员读书月活动总结
2016/04/06 职场文书
财务年终工作总结大全
2019/06/20 职场文书
Java常用工具类汇总 附示例代码
2021/06/26 Java/Android
python实现一个简单的贪吃蛇游戏附代码
2022/06/28 Python