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 对象的定义方法
Jan 10 Javascript
jquery 仿QQ校友的DIV模拟窗口效果源码
Mar 24 Javascript
JS弹出窗口代码大全(详细整理)
Dec 21 Javascript
javascript如何创建表格(javascript绘制表格的二种方法)
Dec 10 Javascript
实现easyui的datagrid导出为excel的示例代码
Nov 10 Javascript
浅谈关于.vue文件中style的scoped属性
Aug 19 Javascript
基于vue1和vue2获取dom元素的方法
Mar 17 Javascript
实现Vue的markdown文档可以在线运行的方法示例
Dec 11 Javascript
详解基于iview-ui的导航栏路径(面包屑)配置
Feb 22 Javascript
教你完全理解ReentrantLock重入锁
Jun 03 Javascript
JavaScript图片旋转效果实现方法详解
Jun 28 Javascript
JS前端基于canvas给图片添加水印
Nov 11 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下SSL加密解密、验证、签名方法(很简单)
2020/06/28 PHP
Yii2实现自定义独立验证器的方法
2017/05/05 PHP
PHP基于自定义函数实现的汉字转拼音功能实例
2017/09/30 PHP
js中replace的用法总结
2013/12/27 Javascript
jQuery1.9.1针对checkbox的调整方法(prop)
2014/05/01 Javascript
javascipt:filter过滤介绍及使用
2014/09/10 Javascript
JavaScript中this详解
2015/09/01 Javascript
JavaScript统计网站访问次数的实现代码
2015/11/18 Javascript
基于JavaScript实现跳转提示页面
2016/09/24 Javascript
JavaScript prototype属性详解
2016/10/25 Javascript
JSON 必知必会 观后记
2016/10/27 Javascript
彻底学会Angular.js中的transclusion
2017/03/12 Javascript
nodejs个人博客开发第七步 后台登陆
2017/04/12 NodeJs
vue实现登陆登出的实现示例
2017/09/15 Javascript
jQuery zTree 异步加载添加子节点重复问题
2017/11/29 jQuery
Vue封装Swiper实现图片轮播效果
2018/02/06 Javascript
原生JS+HTML5实现跟随鼠标一起流动的粒子动画效果
2018/05/03 Javascript
微信小程序仿微信运动步数排行(交互)
2018/07/13 Javascript
JS Object.preventExtensions(),Object.seal()与Object.freeze()用法实例分析
2018/08/25 Javascript
vue 使用element-ui中的Notification自定义按钮并实现关闭功能及如何处理多个通知
2019/08/17 Javascript
用Python实现QQ游戏大家来找茬辅助工具
2014/09/14 Python
Python中统计函数运行耗时的方法
2015/05/05 Python
python利用拉链法实现字典方法示例
2017/03/25 Python
python实现读Excel写入.txt的方法
2018/04/29 Python
TensorFlow数据输入的方法示例
2018/06/19 Python
python绘制多个曲线的折线图
2020/03/23 Python
Python语法分析之字符串格式化
2019/06/13 Python
Python自动生成代码 使用tkinter图形化操作并生成代码框架
2019/09/18 Python
python装饰器代替set get方法实例
2019/12/19 Python
解决python 虚拟环境删除包无法加载的问题
2020/07/13 Python
matplotlib基础绘图命令之imshow的使用
2020/08/13 Python
使用css实现android系统的loading加载动画
2019/07/25 HTML / CSS
Hotels.com加拿大:领先的在线住宿网站
2018/10/05 全球购物
《威尼斯的小艇》教学反思
2014/02/17 职场文书
使用PDF.js渲染canvas实现预览pdf的效果示例
2021/04/17 Javascript
Python基础之hashlib模块详解
2021/05/06 Python