本文实例讲述了js构造函数constructor和原型prototype原理与用法。分享给大家供大家参考，具体如下：所有引用类型（函数，数组，对象）都拥有__proto__属性（隐式原型）所有函数拥有prototype属性（显式原型）（仅限函数）原型对象：拥有prototype属性的对象，在定义函数时就被创建__proto__, prototype和constructor__proto__, prototype和constructor下面这三个属性的定义非常重要，始终贯穿在原型中。

prototype：此属性只有构造函数才有，它指向的是当前构造函数的原型对象。

__proto__：此属性是任何对象在创建时都会有的一个属性，它指向了产生当前对象的构造函数的原型对象，由于并非标准规定属性，不要随便去更改这个属性的值，以免破坏原型链，但是可以借助这个属性来学习，所谓的原型链就是由__proto__连接而成的链。

constructor：此属性只有原型对象才有，它默认指回prototype属性所在的构造函数。
prototype：此属性只有构造函数才有，它指向的是当前构造函数的原型对象。只有构造函数构造函数的原型对象__proto__：此属性是任何对象在创建时都会有的一个属性，它指向了产生当前对象的构造函数的原型对象，由于并非标准规定属性，不要随便去更改这个属性的值，以免破坏原型链，但是可以借助这个属性来学习，所谓的原型链就是由__proto__连接而成的链。任何对象产生当前对象的构造函数的原型对象constructor：此属性只有原型对象才有，它默认指回prototype属性所在的构造函数。只有原型对象prototype属性所在的构造函数构造函数的特点：构造函数的特点：　a:构造函数的首字母必须大写，用来区分于普通函数　b:内部使用的this对象，来指向即将要生成的实例对象　c:使用New来生成实例对象function定义的对象有一个prototype属性，使用new生成的对象就没有这个prototype属性（Person是一个对象）function定义的对象有一个prototype属性，使用new生成的对象就没有这个prototype属性（Person是一个对象）Person是一个对象，它有一个prototype的原型属性（因为所有的对象都一prototype原型！）prototype属性有自己的prototype对象，而pototype对象肯定也有自己的construct(构造)属性，construct属性有自己的constructor(构造函数)对象，神奇的事情要发生了，这最后一个constructor对象就是我们构造出来的function函数本身！constructor对象就是我们构造出来的function函数本身
function Person(name){
this.name=name;
this.showMe=function(){
alert(this.name)
}
}
var one=new Person('js-yeluosen');
one.showMe();
console.log(one.prototype)//undefined
console.log(typeof Person.prototype)//Obiect
console.log(Person.prototype)
console.log(Person.prototype.constructor)


function Person(name){
this.name=name;
this.showMe=function(){
alert(this.name)
}
}
var one=new Person('js-yeluosen');
one.showMe();
console.log(one.prototype)//undefined
console.log(typeof Person.prototype)//Obiect
console.log(Person.prototype)
console.log(Person.prototype.constructor)

当调用某种方法或查找某种属性时，首先会在自身调用和查找，如果自身并没有该属性或方法，则会去它的__proto__属性中调用查找，也就是它构造函数的prototype中调用查找当调用某种方法或查找某种属性时，首先会在自身调用和查找，如果自身并没有该属性或方法，则会去它的__proto__属性中调用查找，也就是它构造函数的prototype中调用查找当函数对象本身的属性或方法与原型的属性或方法同名的时候：
1、默认调用的是函数对象本身的属性或方法.

2、通过原型增加的属性或方法的确是存在的.

3、函数对象本身的属性或方法的优先级要高于原型的属性或方法.
function Hero(){
this.name='jiangyx'
}
Hero.prototype.name="yeluosen"
var mm=new Hero()
// 当调用某种方法或查找某种属性时，首先会在自身调用和查找，如果自身并没有该属性或方法，则会去它的__proto__属性中调用查找，也就是它构造函数的prototype中调用查找
alert(mm.name)//jiangyx
alert(mm.__proto__.name)//jiangyx
delete mm.name
alert(mm.name)//yeluosen


function Hero(){
this.name='jiangyx'
}
Hero.prototype.name="yeluosen"
var mm=new Hero()
// 当调用某种方法或查找某种属性时，首先会在自身调用和查找，如果自身并没有该属性或方法，则会去它的__proto__属性中调用查找，也就是它构造函数的prototype中调用查找
alert(mm.name)//jiangyx
alert(mm.__proto__.name)//jiangyx
delete mm.name
alert(mm.name)//yeluosen


//创建构造函数
function Word(words){

this.words = words;
}
Word.prototype = {

alert(){

alert(this.words);

}
}
//创建实例
var w = new Word("hello world");
w.print = function(){

console.log(this.words);
}
w.print(); //hello world
// 当调用某种方法或查找某种属性时，首先会在自身调用和查找，如果自身并没有该属性或方法，则会去它的__proto__属性中调用查找，也就是它构造函数的prototype中调用查找
// w本身没有alert()方法，所以会去Word()的显式原型中调用alert()，即实例继承构造函数的方法。

w.alert(); //hello world
// 实例w的隐式原型指向它构造函数的显式原型，指向的意思是恒等于
// w.__proto__ === Word.prototype


//创建构造函数
function Word(words){

this.words = words;
}
Word.prototype = {

alert(){

alert(this.words);

}
}
//创建实例
var w = new Word("hello world");
w.print = function(){

console.log(this.words);
}
w.print(); //hello world
// 当调用某种方法或查找某种属性时，首先会在自身调用和查找，如果自身并没有该属性或方法，则会去它的__proto__属性中调用查找，也就是它构造函数的prototype中调用查找
// w本身没有alert()方法，所以会去Word()的显式原型中调用alert()，即实例继承构造函数的方法。

w.alert(); //hello world
// 实例w的隐式原型指向它构造函数的显式原型，指向的意思是恒等于
// w.__proto__ === Word.prototype

print()方法是w实例本身具有的方法，所以w.print()打印hello world；alert()不属于w实例的方法，属于构造函数的方法，w.alert()也会打印hello world，因为实例继承构造函数的方法。实例w的隐式原型指向它构造函数的显式原型，指向的意思是恒等于实例w的隐式原型指向它构造函数的显式原型，指向的意思是恒等于
w.__proto__ === Word.prototype
w.__proto__ === Word.prototype总结总结总结1、prototype只有构造函数才有，指向构造函数的原型。
2、__proto__任何对象都有，指向产生当前对象的构造函数的原型。
3、constructor只有原型对象才有，默认指回prototype属性所在的构造函数，使用原型链继承之后，要给新的原型对象添加constructor属性并指向构造函数。
4、任何对象都有产生自己的构造函数，包括构造函数自己。感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具：http://tools./code/HtmlJsRun测试上述代码运行效果。在线HTML/CSS/JavaScript代码运行工具在线HTML/CSS/JavaScript代码运行工具http://tools./code/HtmlJsRun关于JavaScript相关内容感兴趣的读者可查看本站专题：《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》javascript面向对象入门教程JavaScript错误与调试技巧总结JavaScript数据结构与算法技巧总结JavaScript遍历算法与技巧总结JavaScript数学运算用法总结希望本文所述对大家JavaScript程序设计有所帮助。