关于js中的prototype

2019独角兽企业重金招聘Python工程师标准>>>

之前一直没注意prototype方法,可能是一直都没用到面向对象的编程思想来写JS 今天来总结下prototype的用法

我的理解是 prototype 是为特定的类制造出通用的变量或函数来.

prototype 是在 IE 4 及其以后版本引入的一个针对于某一类的对象的方法，而且特殊的地方便在于：它是一个给类的对象添加方法的方法. 因为JavaScript 本身是一种面向对象的语言，它所涉及的元素根据其属性的不同都依附于某一个特定的类。我们所常见的类包括：数组变量(Array)、逻辑变量(Boolean)、日期变量(Date)、结构变量(Function)、数值变量(Number)、对象变量(Object)、字符串变量(String) 等，而相关的类的方法，也是程序员经常用到的，例如数组的push方法、日期的get系列方法、字符串的split方法等等. 但是在实际的编程过程中不知道有没有感觉到现有方法的不足？prototype 方法应运而生！

先举个小例子: JS里数组也是一个类,Array,如果我想实现Array.push() 这个方法,就要用到prototype来拓展这个类了: <!--lang:js--> Array.prototype.push = function(new_element) { this[this.length] = new_element; return this.length; }

让我们进一步来增强他，让他可以一次增加多个元素！ <!--lang:js--> Array.prototype.pushPro = function() { var currentLength = this.length; for (var i = 0; i < arguments.length; i++) { this[currentLength + i] = arguments[i]; } return this.length; }

prototype 在每一个构造函数里都存在,所以不需要显式的来声明他 <!--lang:js--> function gouzao() { ... } console.log(gouzao.prototype); // 会输出Object

给prototype添加属性 就如你在上面所看到的，prototype是一个对象，因此，你能够给它添加属性。你添加给prototype的属性将会成为使用这个构造函数创建的对象的通用属性。

例如，我下面有一个类Bird，我想让所有的鸟都有这些属性：have="wings"和legs="two"；为了实现这个，我可以给构造函数Bird的prototype添加那些属性。 <!--lang:js--> function Bird(kind,color) { this.kind = kind; this.color = color; } Bird.prototype.have = "wings"; Bird.prototype.legs = "two";

下面我们来实例化几只鸟

<!--lang:js-->
var Bird1 = new Bird('黄鹂鸟', 'yellow');
var Bird2 = new Bird("乌鸦", 'black');
var Bird3 = new Bird("天鹅", 'white');

我们来打印下这些鸟的所有属性:

<!--lang:js-->
for(var i=1;i<=3;i++) {
    var bird = eval_r("Bird"+i);
    console.log(bird.kind+','+bird.color+','+bird.have+','+bird.legs);
}

输出的结果应该是

黄鹂鸟,yellow,wings,two 乌鸦,black,wings,two 天鹅,white,wings,two

你也可以通过prototype来给所有对象添加共用的函数. <!--lang:js--> function Employee(name, salary) { this.name=name;
this.salary=salary; } Employee.prototype.getSalary=function getSalaryFunction() { return this.salary; } Employee.prototype.addSalary=function addSalaryFunction(addition) { this.salary=this.salary+addition; }

我们可以象通常那样创建对象： <!--lang:js--> var boss1=new Employee("Joan", 200000); var boss2=new Employee("Kim", 100000); var boss3=new Employee("Sam", 150000);

结果应该执行如下: alert(boss1.getSalary()); // 输出 200000 alert(boss2.getSalary()); // 输出 100000 alert(boss3.getSalary()); // 输出 150000

转载于:https://my.oschina.net/guanyue/blog/267423