JavaScript中神奇的call()方法


Posted in Javascript onMarch 12, 2015

先看看关于call()的官方解释,“调用一个对象的一个方法,以另一个对象替换当前对象。”,看了这样的解释,或许让你更摸不着头脑了。看例子:

var x = "我是全局变量";
//定义全局变量x

function a(){



 //定义函数类结构a


    this.x = "我是在函数类结构a中声明的哦";    

}

//定义普通函数,弹出当前指针所包含的变量x的值

function f(){       

    alert (this.x);

}

//返回值为“我是在函数类结构a中声明的哦”

f.call(new a());

我的理解是,f.call(new a())就是把函数(其实也是对象)f复制到被调用对象“new a()”下面去解析,事实上和下面这段代码的解析结果一样:
function a(){
this.x = "我是在函数类结构a中声明的哦";

alert(this.x);    

}

a();

只不过此时变量X的作用域不同而已,咿…看起来好像有点继承的味道哦,难道不是吗?在上例中,f完全被构造函数a的实力对象继承了,如果说这还不足以说明a.call(b)是一种继承模式,那么再看一个更具有继承味道的用法吧。
function f(){    

    this.a ="a";    

    this.b = function(){    

        alert("b");

    }

}

function e(){    

    f.call(this);     

}

var c = new e();

alert(c.a);  //弹出a

c.b();    //弹出b

在这个例子中,只要会使用浏览器的朋友,都能看得出来e完全继承了f的属性和方法,否则是无法解释的,因为在e中并没有定义属性a和b,那么按常理推断在e的实例对象c中,并不会出现这两个属性。
Javascript 相关文章推荐
JQuery 技巧和窍门整理(8个)
Apr 22 Javascript
jquery获取div宽度的实现思路与代码
Jan 13 Javascript
js中replace的用法总结
Dec 27 Javascript
jquery-syntax动态语法着色示例代码
May 14 Javascript
javascript关于继承的用法汇总
Dec 20 Javascript
JavaScript html5 canvas绘制时钟效果
Mar 01 Javascript
基于JQuery实现分隔条的功能
Jun 17 Javascript
使用JS实现图片展示瀑布流效果(简单实例)
Sep 06 Javascript
用jQuery实现圆点图片轮播效果
Mar 19 Javascript
vue loadmore组件上拉加载更多功能示例代码
Jul 19 Javascript
mac中利用NVM管理不同node版本的方法详解
Nov 08 Javascript
微信小程序按顺序同步执行的两种方式
Dec 20 Javascript
jquery实现无限分级横向导航菜单的方法
Mar 12 #Javascript
JavaScript中定义函数的三种方法
Mar 12 #Javascript
javascript实时显示北京时间的方法
Mar 12 #Javascript
jquery实现焦点图片随机切换效果的方法
Mar 12 #Javascript
JavaScript数据结构与算法之栈详解
Mar 12 #Javascript
jQuery实现简单的日期输入格式化控件
Mar 12 #Javascript
Javascript数据结构与算法之列表详解
Mar 12 #Javascript
You might like
解析web文件操作常见安全漏洞(目录、文件名检测漏洞)
2013/06/29 PHP
php获取文件夹路径内的图片以及分页显示示例
2014/03/11 PHP
destoon调用自定义模板及样式的公告栏
2014/06/21 PHP
PHP判断是手机端还是PC端 PHP判断是否是微信浏览器
2017/03/15 PHP
PHP简单留言本功能实现代码
2017/06/09 PHP
Aster vs KG BO3 第三场2.19
2021/03/10 DOTA
一个javascript参数的小问题
2008/03/02 Javascript
使用jQuery快速解决input中placeholder值在ie中无法支持的问题
2014/01/02 Javascript
Javascript原型链和原型的一个误区
2014/10/22 Javascript
如何使用AngularJs打造权限管理系统【简易型】
2016/05/09 Javascript
BootStrap下jQuery自动完成的样式调整
2016/05/30 Javascript
AngularJS基础 ng-hide 指令用法及示例代码
2016/08/01 Javascript
js输入框使用正则表达式校验输入内容的实例
2017/02/12 Javascript
vue组件发布到npm简单步骤
2017/11/30 Javascript
vue自定义键盘信息、监听数据变化的方法示例【基于vm.$watch】
2019/03/16 Javascript
详解vue 组件的实现原理
2020/11/12 Javascript
重命名批处理python脚本
2013/04/05 Python
Python基于有道实现英汉字典功能
2015/07/25 Python
python中defaultdict的用法详解
2017/06/07 Python
Python实现计算对象的内存大小示例
2019/07/10 Python
python 用所有标点符号分隔句子的示例
2019/07/15 Python
python中turtle库的简单使用教程
2020/11/11 Python
python判断all函数输出结果是否为true的方法
2020/12/03 Python
Web时代变迁及html5与html4的区别
2016/01/06 HTML / CSS
Spartoo芬兰:欧洲最大的网上鞋店
2016/08/28 全球购物
LORAC官网:美国彩妆品牌
2019/08/27 全球购物
金融专业应届生求职信
2013/11/02 职场文书
幼儿园实习生辞职信
2014/01/20 职场文书
运动会入场词50字
2014/02/20 职场文书
2015年七夕情人节活动方案
2015/05/06 职场文书
歌剧魅影观后感
2015/06/05 职场文书
大学校园招聘会感想
2015/08/10 职场文书
幼儿园托班开学寄语(2016春季)
2015/12/03 职场文书
小学四年级作文之写景
2019/08/23 职场文书
Java Kafka 消费积压监控的示例代码
2021/07/01 Java/Android
Go语言的协程上下文的几个方法和用法
2022/04/11 Golang