理解Javascript的call、apply


Posted in Javascript onDecember 16, 2015

call 方法在使用一个指定的this值和若干个指定的参数值的前提下调用某个函数或方法.

注意:该函数的语法与 apply() 方法的语法几乎完全相同,唯一的区别在于,apply()方法接受的是一个参数数组,而 call()方法接受的是一系列参数列表。

了解完这两个方法的概念后,我们来一步一步理解他们的应用.

改变方法内this的指向
我们先来看下面这个例子

var name = "编程的人";
var age = 1;
var person = {
name:"公众号:bianchengderen",
age:20
}
function say(){
console.log("我叫:"+this.name+",年龄:"+this.age)
}
say();// 我叫: 编程的人,年龄: 1
say.call(person);//年龄:20

这两种调用执行的方式不一样,他们的结果也不一样,不一样在于say方法里面的this指向了不同的对象,第一次执行指向的是window,而我们以call方式执行,将say方法里面的this指向了person对象.
这是不是有点冒充别人的感觉.那我们这样有什么作用了?当然自己可以多多想想,到底能做什么! 我们继续往下面走.

实现继承机制
继承,这是高级面向对象的一种特性,用call我们可以将JAVASCRIPT有这种特点.
在看下面这个例子之前,必须好好理解上面的例子.

function Person(){
this.name = "编程的人";
this.age = 20;
}
function Student(){
Person.call(this);
this.school = "地球";
}
var student = new Student();
//下面打印出来: 编程的人,20,地球
console.log(student.name,student.age,student.school);

在这个例子里,Student函数继承了Person的name和age属性,就是通过Person.call(this)来实现,理解上面的例子后,应该是不难理解的.所以Student即拥有了Person的特点,又有自己的个性,比如这个this.school.

在这里,我们没有涉及到加入参数的传递,是方便大家的理解,需要加入参数传递,大家可以敲代码试一试,看看效果怎么样!

我们就先讲这两个例子吧,之后再进行深入学习。

Javascript 相关文章推荐
如何学习Javascript入门指导
Nov 01 Javascript
Node.js 异步编程之 Callback介绍(一)
Mar 30 Javascript
原生javascript实现的ajax异步封装功能示例
Nov 03 Javascript
如何判断出一个js对象是否一个dom对象
Nov 24 Javascript
原生JS简单实现ajax的方法示例
Nov 29 Javascript
用headjs来管理和加载js 提高网站加载速度
Nov 29 Javascript
在JS中a标签加入单击事件屏蔽href跳转页面
Dec 16 Javascript
详解如何去除vue项目中的#——History模式
Oct 13 Javascript
Vue项目全局配置微信分享思路详解
May 04 Javascript
vue封装swiper代码实例解析
Oct 08 Javascript
Vue基础配置讲解
Nov 29 Javascript
JavaScript事件委托实现原理及优点进行
Aug 29 Javascript
javascript实现网站加入收藏功能
Dec 16 #Javascript
javascript实现无缝上下滚动特效
Dec 16 #Javascript
js实现将选中内容分享到新浪或腾讯微博
Dec 16 #Javascript
JavaScript运行过程中的“预编译阶段”和“执行阶段”
Dec 16 #Javascript
Sublime Text 3常用插件及安装方法
Dec 16 #Javascript
基于MVC4+EasyUI的Web开发框架形成之旅之界面控件的使用
Dec 16 #Javascript
基于JavaScript获取鼠标位置的各种方法
Dec 16 #Javascript
You might like
php读取msn上的用户信息类
2008/12/05 PHP
php 获取远程网页内容的函数
2009/09/08 PHP
php checkdate、getdate等日期时间函数操作详解
2010/03/11 PHP
php判断输入不超过mysql的varchar字段的长度范围
2011/06/24 PHP
php使用mkdir创建多级目录入门例子
2014/05/10 PHP
weiphp微信公众平台授权设置
2016/01/04 PHP
php实现与python进行socket通信的方法示例
2017/08/30 PHP
PHP cookie与session会话基本用法实例分析
2019/11/18 PHP
JavaScript等比例缩放图片控制超出范围的图片
2013/08/06 Javascript
jquery easyUI中ajax异步校验用户名
2016/08/19 Javascript
JavaScript中数组的各种操作的总结(必看篇)
2017/02/13 Javascript
JS移动端/H5同时选择多张图片上传并使用canvas压缩图片
2017/06/20 Javascript
AngularJS中下拉框的高级用法示例
2017/10/11 Javascript
JS 中document.write()的用法和清空的原因浅析
2017/12/04 Javascript
使用vue-router与v-if实现tab切换遇到的问题及解决方法
2018/09/07 Javascript
vue解决一个方法同时发送多个请求的问题
2018/09/25 Javascript
JS实现点击按钮随机生成可拖动的不同颜色块示例
2019/01/30 Javascript
vue父组件触发事件改变子组件的值的方法实例详解
2019/05/07 Javascript
基于Taro的微信小程序模板消息-获取formId功能模块封装实践
2019/07/15 Javascript
基于vue hash模式微信分享#号的解决
2020/09/07 Javascript
python实现的简单窗口倒计时界面实例
2015/05/05 Python
利用python实现数据分析
2017/01/11 Python
详解pyqt5 动画在QThread线程中无法运行问题
2018/05/05 Python
实践Vim配置python开发环境
2018/07/02 Python
Python地图绘制实操详解
2019/03/04 Python
python接口调用已训练好的caffe模型测试分类方法
2019/08/26 Python
TFRecord文件查看包含的所有Features代码
2020/02/17 Python
Python3 shelve对象持久存储原理详解
2020/03/23 Python
Python 如何批量更新已安装的库
2020/05/26 Python
python实现学生通讯录管理系统
2021/02/25 Python
请写出 BOOL flag 与"零值"比较的 if 语句
2016/02/29 面试题
文明青少年标兵事迹材料
2014/01/28 职场文书
成绩单公证书
2014/04/10 职场文书
党的群众路线教育实践活动总结报告
2014/07/03 职场文书
教师节学生演讲稿
2014/09/03 职场文书
具结保证书范本
2015/05/11 职场文书