名站网址导航为大家提供关于网站网页设计设计相关的的教程知识。

• 本篇文章具体介绍如下

Javascript中所有function中都有一个prototype属性，并且这个prototype属性是一个object类型的对象，所有由该function构造出来的对象都具有这个prototype上的特性，也就是说可以用构造出来的对象直接访问prototype上的属性和方法。
下面一段具体代码演示prototype的使用方法：
具体代码如下:
function Staff(name) {
this.name = name;
}
Staff.prototype.say = function() {
alert(this.name " say hello");
}
var staff1 = new Staff("hunter");
var staff2 = new Staff("dangjian");
staff1.say();
staff2.say();

运行如上的程序，可知prototype上的属性和方法可以通过创建的对象之间调用，更重要的是prototype中的属性和方法是在同类型的对象中是共享的
具体代码如下: alert( staff1.say == staff2.say);

prototype另外一个常用的特性是通过prototype构建对象的继承关系，通过把基类对象赋给子类的prototype的方式可以模拟面向对象中的继承关系，这就是大家经常说的JavaScript的面向对象机制。如下的具体代码段演示了利用这一特性构建对象的继承关系:
具体代码如下:
function Staff(name) { // 基类
this.name = name;
}
Staff.prototype.say = function() {
alert(this.name " say hello");
}
function ManStaff(name, age) { // 子类
this.name = name;
this.age = age;
}
ManStaff.prototype = new Staff(); // 建立继承关系
var manStaff1 = new ManStaff("hunter", 22);
var manStaff2 = new ManStaff("dangjian", 32);
manStaff1.say();
manStaff2.say();

运行具体代码可知，ManStaff对象中具有了基类Staff中的Say方法，这种继承方式在JavaScript中是通过prototype链来实现的。大家可能熟悉以上的prototype用法，可是作为程序员，我们不光要知道其用法，我们更应该理解其可是prototype的内部机制。下面我们来分析prototype的原理以及prototype链的实现。
要理解prototype的机制就必须要了解JavaScript中function的创建方式。
当具体代码执行到function Staff(name) {this.name = name;}时，相当于执行var Staff = new Function(“name”, "this.name = name”)解释器将使用预定义好的Function() constructor，来创建一个function类型的object出来，即Staff。

随后给创建好的Staff对象添加__proto__属性，并赋值为Function的构造器的prototype，这一步是所有对象创建过程中都有的步骤，在执行类似var x = new X()方式是，都会把X的prototype赋值给x的__proto__，类似如下的赋值：
具体代码如下:
Staff.__proto__ = Function.prototype;

接下来给Staff创建prototype属性，这一步是创建function类型的对象具有的步骤，创建的过程如下伪具体代码：
具体代码如下:
var o = new Object();
o.constructor = Base;
Staff.prototype = o;

如上的分析我们可知，当创建对象时，会创建一个私有属性__proto__，当创建function是会创建一个prototype属性。因为Staff是一个function类型的对象，所以会同时具有这两个属性。
这两个属性是构建原型链的关键属性。我们来分析执行具体代码 var staff1 = new Staff(“hunter”)时，原型是如何传递的。
根据如上分析，staff1.__proto__ = Staff.prototype，而Staff.prototype又是一个由Object创建的对象，即Staff.prototype.__proto__ = Object.prototype，所以staff1.__proto__ .__proto__ 指向的是Object.prototype，即staff1.__proto__ .__proto__ == Object.prototype，这就是原型链，当要读取某个对象的属性时，JS首先找对象本身是否有这个属性，如果没有就会顺着原型链一直寻找这个属性。
知道了原型链的原理，那么就很容易根据这个原理来构建Javascript中的对象继承。
由如上的分析，我们可知原型链的顶端都是Object.prototype，这就意味着在构建的继承关系中Object是所有对象的基类，可以运行如下的具体代码验证。
具体代码如下:
Object.prototype.location = "China";
function Staff(name) { // 基类
this.name = name;
}
Staff.prototype.say = function() {
alert(this.name " say hello");
}
var ManStaff1 = new Staff("hunter");
var ManStaff2 = new Staff("dangjian");
alert(ManStaff1.location);
alert(ManStaff2.location);

运行结果知道，Object是Staff的基类，那么要如何构建一个Staff的子类呢？
理解了上面函数的建立原理，我们很容易写出如下的具体代码：
具体代码如下:
function Staff(name) { // 基类
this.name = name;
}
Staff.prototype.say = function() {
alert(this.name " say hello");
}
function ManStaff(name, age) { // 子类
Staff.call(this,name);
this.age = age;
}
ManStaff.prototype = new Staff(); // 建立继承关系
var ManStaff1 = new ManStaff("hunter", 22);
var ManStaff2 = new ManStaff("dangjian", 32);
ManStaff1.say();
ManStaff2.say();

建立继承关系的就是这句：ManStaff.prototype = new Staff(); ，继承关系推算如下：ManStaff1.__proto__ = =ManStaff.prototype， ManStaff.prototype.__proto__ = Staff.prototype, Staff.prototype.__proto__ == Object.prototype；则ManStaff1.__proto__.__proto__.__proto__ == Object.prototype。
javascript中的这种继承关系比较传统面向对象的继承关系更松散，构建方式也比较难以理解，但是作为脚本语言，其功能已经是非常强大了。

Chrome Form多次提交表单问题的解决方法-javascript技巧aNcAIChat_企业网址导航_网址分类目录_企业黄页网址提交查询专业网站！

aNcAIChat_企业网址导航_网址分类目录_企业黄页网址提交查询专业网站！

好了关于网站网页设计设计相关的这篇文章就给大家介绍到这里不明白的地方给本站留言。声明，本站内容来源于互联网，如果侵犯了你的权益请联系本站删除。,