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 相关文章推荐
JQERY limittext 插件0.2版(长内容限制显示)
Aug 27 Javascript
javascript数字数组去重复项的实现代码
Dec 30 Javascript
jQuery常见开发技巧详细整理
Jan 02 Javascript
angularJS 中$scope方法使用指南
Feb 09 Javascript
js事件监听器用法实例详解
Jun 01 Javascript
jquery中val()方法是从最后一个选项往前读取的
Sep 06 Javascript
JS实现兼容性好,自动置顶的淘宝悬浮工具栏效果
Sep 18 Javascript
Angular在一个页面中使用两个ng-app的方法
Feb 20 Javascript
node使用UEditor富文本编辑器的方法实例
Jul 11 Javascript
jQuery发请求传输中文参数乱码问题的解决方案
May 22 jQuery
如何使用pm2快速将项目部署到远程服务器
Mar 12 Javascript
JS document form表单元素操作完整示例
Jan 13 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使用qr生成二维码的示例分享
2014/01/20 PHP
ThinkPHP权限认证Auth实例详解
2014/07/22 PHP
PHP实现在线阅读PDF文件的方法
2015/06/23 PHP
WordPress用户登录框密码的隐藏与部分显示技巧
2015/12/31 PHP
php ajax实现文件上传进度条
2016/03/29 PHP
PHP中创建和编辑Excel表格的方法
2018/09/13 PHP
TP框架实现上传一张图片和批量上传图片的方法分析
2020/04/23 PHP
关于flash遮盖div浮动层的解决方法
2010/07/17 Javascript
网络之美 JavaScript中Get和Set访问器的实现代码
2010/09/19 Javascript
让textarea自动调整大小的js代码
2011/04/12 Javascript
JavaScript中的property和attribute介绍
2011/12/26 Javascript
JQuery入门—编写一个简单的JQuery应用案例
2013/01/03 Javascript
jQuery 绑定事件到动态创建的元素上的方法实例
2013/08/18 Javascript
JS动态添加与删除select中的Option对象(示例代码)
2013/12/25 Javascript
JsRender for object语法简介
2014/10/31 Javascript
浅谈Javascript Base64 加密解密
2014/12/28 Javascript
详解Backbone.js框架中的模型Model与其集合collection
2016/05/05 Javascript
js显示动态时间的方法详解
2016/08/20 Javascript
AngularJS全局scope与Isolate scope通信用法示例
2016/11/22 Javascript
JavaScript自定义函数实现查找两个字符串最长公共子串的方法
2016/11/24 Javascript
JavaScript 中的12种循环遍历方法【总结】
2018/05/31 Javascript
JavaScript 获取滚动条位置并将页面滑动到锚点
2021/02/08 Javascript
python实战之实现excel读取、统计、写入的示例讲解
2018/05/02 Python
mac下如何将python2.7改为python3
2018/07/13 Python
详解Django3中直接添加Websockets方式
2020/02/12 Python
python 一维二维插值实例
2020/04/22 Python
python针对Oracle常见查询操作实例分析
2020/04/30 Python
Python常用断言函数实例汇总
2020/11/30 Python
html5指南-7.geolocation结合google maps开发一个小的应用
2013/01/07 HTML / CSS
里程积分管理买卖交换平台:Points.com
2017/01/13 全球购物
BrandAlley英国:法国折扣奢侈品网上零售商
2017/07/03 全球购物
澳大利亚优质的家居用品和生活方式公司:Bed Bath N’ Table
2019/04/16 全球购物
What is the purpose of Void class? Void类的作用是什么?
2016/10/31 面试题
使用索引(Index)有哪些需要考虑的因素
2016/10/19 面试题
企业培训简报范文
2015/07/20 职场文书
手把手教你用SpringBoot将文件打包成zip存放或导出
2021/06/11 Java/Android