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 相关文章推荐
javascript之对系统的toFixed()方法的修正
May 08 Javascript
javascript 函数参数限制说明
Nov 19 Javascript
浅析js封装和作用域
Jul 09 Javascript
文本框回车提交与禁止提交示例
Sep 27 Javascript
初识SmartJS - AOP三剑客
Jun 08 Javascript
基于jQuery滑动杆实现购买日期选择效果
Sep 15 Javascript
解决bootstrap导航栏navbar在IE8上存在缺陷的方法
Jul 01 Javascript
深入学习Bootstrap表单
Dec 13 Javascript
jQuery Tree Multiselect使用详解
May 02 jQuery
你可能不知道的JSON.stringify()详解
Aug 17 Javascript
vue初始化动画加载的实例
Sep 01 Javascript
微信小程序实现tab左右切换效果
Nov 15 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
php注册系统和使用Xajax即时验证用户名是否被占用
2017/08/31 PHP
Aster vs KG BO3 第一场2.18
2021/03/10 DOTA
javascript prototype 原型链
2009/03/12 Javascript
jquery常用技巧及常用方法列表集合
2011/04/06 Javascript
Extjs中ComboBox加载并赋初值的实现方法
2012/03/22 Javascript
原生javascript实现无间缝滚动示例
2014/01/28 Javascript
我的Node.js学习之路(四)--单元测试
2014/07/06 Javascript
js构造函数、索引数组和属性的实现方式和使用
2014/11/16 Javascript
node.js中的path.join方法使用说明
2014/12/08 Javascript
javascript文件加载管理简单实现方法
2015/07/25 Javascript
跟我学习javascript的严格模式
2015/11/16 Javascript
angular分页指令操作
2017/01/09 Javascript
jquery.masonry瀑布流效果
2017/05/25 jQuery
30分钟快速实现小程序语音识别功能
2018/11/27 Javascript
ionic2.0双击返回键退出应用
2019/09/17 Javascript
node.js事件轮询机制原理知识点
2019/12/22 Javascript
python类参数self使用示例
2014/02/17 Python
Win7上搭建Cocos2d-x 3.1.1开发环境
2014/07/03 Python
python自动格式化json文件的方法
2015/03/11 Python
Python按行读取文件的简单实现方法
2016/06/22 Python
Linux RedHat下安装Python2.7开发环境
2017/05/20 Python
python将视频转换为全字符视频
2019/04/26 Python
python3 自动打印出最新版本执行的mysql2redis实例
2020/04/09 Python
Python多线程实现支付模拟请求过程解析
2020/04/21 Python
Python+Appium实现自动化清理微信僵尸好友的方法
2021/02/04 Python
CSS3 input框的实现代码类似Google登录的动画效果
2020/08/04 HTML / CSS
豆腐の盛田屋官网:日本自然派的豆乳面膜、肥皂、化妆水、乳液等
2016/10/08 全球购物
印度婴儿用品在线商店:Firstcry.com
2016/12/05 全球购物
项目合作协议书
2014/04/16 职场文书
竞选学生会演讲稿
2014/04/25 职场文书
董事长秘书岗位职责
2015/02/13 职场文书
工程合作意向书范本
2015/05/09 职场文书
毕业设计答辩开场白
2015/05/29 职场文书
2016年学校禁毒宣传活动工作总结
2016/04/05 职场文书
导游词之安徽九华山
2019/09/18 职场文书
SQL Server使用CROSS APPLY与OUTER APPLY实现连接查询
2022/05/25 SQL Server