1. 前言

为什么将这三个概念放在一起说。原因是这些是会在实现js 继承会需要使用到的

2. call 和 apply

call 和 apply 的作用基本类似， 都是去执行function并将这个function 的context替换成第一个参数带入。 两者的不同是call 必须将function 的参数一一带入，而 apply  只要在第二个参数带入一个数列。
  1. function fn( arg1, arg2,... ){
  2. // do something
  3. }
  4. fn( arg1, arg2,... );
  5. fn.call( context, arg1, arg2,... );
  6. fn.apply( context, [ arg1, arg2,... ]);

手册的解释：
===================================
call 方法
调用一个对象的一个方法，以另一个对象替换当前对象。

call([thisObj[,arg1[, arg2[,   [,.argN]]]]])

参数
thisObj
可选项。将被用作当前对象的对象。

arg1, arg2,  , argN
可选项。将被传递方法参数序列。

说明
call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。

如果没有提供 thisObj 参数，那么 Global 对象被用作 thisObj。
=====================================

  1. <!--by oscar999 2013-1-17-->
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  3. <html>
  4. <head>
  5. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  6. <title>Insert title here</title>
  7. </head>
  8. <body>
  9. <script>
  10. var func=new function(){this.a="func"}
  11. var newfunc=function(x){
  12. var a="newfunc";
  13. alert(this.a);
  14. alert(x);
  15. }
  16. newfunc.call(func,"inputParameter1");
  17. /*alert are
  18. * func/inputParameter1; not newfunc/inputParameter1
  19. */
  20. </script>
  21. </body>
  22. </html>

从以上的例子可以看出， alert(this.a), 返回的是并不是当前函数里的值。

使用call 执行的速度会稍微快一些， 不过差异不大。

3.prototype

JavaScript没有"子类"和"父类"的概念，也没有"类"（class）和"实例"（instance）的区分，全靠一种很奇特的"原型链"（prototype chain）模式，来实现继承。
prototype 其实就是构造函数的一个属性。
所有实例对象需要共享的属性和方法，都放在这个对象里面；那些不需要共享的属性和方法，就放在构造函数里面。
实例对象一旦创建，将自动引用prototype对象的属性和方法。也就是说，实例对象的属性和方法，分成两种，一种是本地的，另一种是引用的。

  1. function Person(name){
  2. this.name = name;
  3. this.gender = "male";
  4. }
  5. var person1 = new Person("MM");
  6. var person2 = new Person("YY");
  7. person1.gender = "female";
  8. alert(person2.gender);// male
  9. </script>
  1. <script>
  2. function Person(name){
  3. this.name = name;
  4. }
  5. Person.prototype.gender = "female";
  6. var person1 = new Person("MM");
  7. var person2 = new Person("YY");
  8. alert(person2.gender);// male
  9. </script>

比较以上两个例子就知道了。

4. 参考

http://www.ruanyifeng.com/blog/2011/06/designing_ideas_of_inheritance_mechanism_in_javascript.html

JavaScript 之call , apply 和prototype 介绍的更多相关文章

  1. JavaScript中call,apply和prototype

    [TOC] call()方法 语法:call([thisObj[,arg1[, arg2[, [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一个对象替换当前对象. 如果没有提供 thi ...

  2. javascript call与apply关键字的作用

    apply接受两个参数.第一个参数指定函数体内this对象的指向,第二个参数为一个带下标的集合. call则是apply的语法糖,如果参数数量固定,则可以不用带下标的集合传第二个参数. 1 2 3 4 ...

  3. 《JavaScript总结》apply、call和bind方法

    在JavaScript中,apply.call.bind这个三个方法,它们的作用都是为了改变某个函数运行时的上下文, 也就是改变函数体内的this指向. 在一个函数里,存在“定义时上下文”.“运行时上 ...

  4. Java程序猿的JavaScript学习笔记（5——prototype和Object内置方法）

    计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...

  5. 深入了解JavaScript中基于原型（prototype）的继承机制

    原型 前言 继承是面向对象编程中相当重要的一个概念,它对帮助代码复用起到了很大的作用. 正文 Brendan Eich在创建JavaScript时,没有选择当时最流行的类继承机制,而是借鉴Self,用 ...

  6. js继承之call,apply和prototype随谈

    在js中,call,apply和prototype都可以实现对象的继承,下面我们看一个例子: function FatherObj1() { this.sayhello = "I am jo ...

  7. javascript中call,apply,bind的用法对比分析

    这篇文章主要给大家对比分析了javascript中call,apply,bind三个函数的用法,非常的详细,这里推荐给小伙伴们.   关于call,apply,bind这三个函数的用法,是学习java ...

  8. 转---- javascript prototype介绍的文章

    JavaScript是基于对象的,任何元素都可以看成对象.然而,类型和对象是不同的.本文中,我们除了讨论类型和对象的一些特点之外,更重要的是研究如何写出好的并且利于重用的类型.毕竟,JavaScrip ...

  9. JavaScript中的apply()方法和call()方法使用介绍

    1.每个函数都包含两个非继承而来的方法:apply()和call(). 2.他们的用途相同,都是在特定的作用域中调用函数. 3.接收参数方面不同,apply()接收两个参数,一个是函数运行的作用域(t ...

随机推荐

  1. IdentityServer3零星笔记

    Scope 是什么?有哪几种类型?每种类型都怎么使用? StandardScopes.All是什么概念? 解释:在Scope的Claims属性里包含的所有声明(类型是ScopeClaim,它的name ...

  2. 区间数字的按位与 Bitwise AND of Numbers Range

    2018-08-13 22:50:51 问题描述: 问题求解: 首先如果m 和 n不相等,那么必然会有至少一对奇偶数,那么必然末尾是0. 之后需要将m 和 n将右移一位,直到m 和 n相等. 本质上, ...

  3. English trip -- VC(情景课)5 C It's on Main Street 在主街上

    Grammar focus 语法点: on,   在...上 next to ,   旁边,周围 aross from ,  对面 between  在...之间 in front of  在…前面 ...

  4. robot framework学习笔记1之_环境安装（win7）

    一.简介 Robotframework是基于Python的自动化测试框架.使用关键字驱动的测试方法,自带丰富的库函数可直接引用,可使用Java/Python进行功能库扩展,测试用例使用TSV/HTML ...

  5. 『科学计算』可视化二元正态分布&3D科学可视化实战

    二元正态分布可视化本体 由于近来一直再看kaggle的入门书(sklearn入门手册的感觉233),感觉对机器学习的理解加深了不少(实际上就只是调包能力加强了),联想到假期在python科学计算上也算 ...

  6. ASP.NET的内置对象 —— Response 对象

    在 ASP.NET 中,页面实际上是一个输出 HTML 的可执行对象. 传统的 ASP 程序通常将 ASP 代码和 HTML 标签集成在一个文件中,或者将其分离于多个文 件. 当执行文件时,服务器回从 ...

  7. 教你一步一步用 Node.js 制作慕课网视频爬虫

    转自:http://www.jianshu.com/p/d7631fc695af 开始 这个教程十分适合初学 Node.js 的初学者看(因为我也是一只初学的菜鸟~) 在这里,我就默认大家都已经在自己 ...

  8. Vscode设置个人爱好

    Vscode设置个人爱好   插件列表 abusaidm.html-snippets-0.1.0 adamwalzer.string-converter-0.0.9 AESSoft.aessoft-c ...

  9. windows创建窗口、关闭窗口流程

    NC,即 non-client 区域,包括标题栏.窗口边框.最大.最小按钮.滚动条等. 一.在调用Windows的::CreateWindowEx函数创建窗口时,一般会先发出 WM_NCCREATE消 ...

  10. 自定义oncontextmenu

    <!doctype html> <html> <head> <meta charset="utf-8"> <meta name ...