JavaScript构造函数详解
构造函数就是初始化一个实例对象，对象的prototype属性是继承一个实例对象。
构造函数注意事项：
1.默认函数首字母大写
2.构造函数并没有显示返回任何东西。new 操作符会自动创建给定的类型并返回他们，当调用构造函数时，new会自动创建this对象，且类型就是构造函数类型。
3.也可以在构造函数中显示调用return.如果返回的值是一个对象，它会代替新创建的对象实例返回。如果返回的值是一个原始类型，它会被忽略，新创建的实例会被返回。
function Person( name){
this.name =name;
}
var p1=new Person('John');
等同于：
function person(name ){
Object obj =new Object();
obj.name =name;
return obj;
}
var p1= person("John");
4.因为构造函数也是函数，所以可以直接被调用，但是它的返回值为undefine，此时构造函数里面的this对象等于全局this对象。this.name其实就是创建一个全局的变量name。在严格模式下，当你补通过new 调用Person构造函数会出现错误。
5.也可以在构造函数中用Object.defineProperty()方法来帮助我们初始化：
function Person( name){
Object.defineProperty(this, "name"{
get :function(){
return name;
},
set:function (newName){
name =newName;
},
enumerable :true, //可枚举，默认为false
configurable:true //可配置
});
}
var p1=new Person('John');
6.在构造函数中使用原型对象
//比直接在构造函数中写的效率要高的多
Person.prototype.sayName= function(){
console.log(this.name);
};
但是如果方法比较多的话，大多人会采用一种更简洁的方法：直接使用一个对象字面形式替换原型对象，如下：
Person.prototype ={
sayName :function(){
console.log(this.name);
},
toString :function(){
return "[Person "+ this.name+"]" ;
}
};
这种方式非常流行，因为你不用多次键入Person.prototype，但有一个副作用你一定要注意：
使用字面量形式改写了原型对象改变了构造函数的属性，因此他指向Object而不是Person。这是因为原型对象具有一个constructor属性，这是其他对象实例所没有的。当一个函数被创建时，它的prototype属性也被创建，且该原型对象的constructor属性指向该函数。当使用对象字面量形式改写原型对象时，其constructor属性将被置为泛用对象Object.为了避免这一点，需要在改写原型对象的时候手动重置constructor,如下：
Person.prototype ={
constructor :Person,
sayName :function(){
console.log(this.name);
},
toString :function(){
return "[Person "+ this.name+"]" ;
}
};
再次测试：
p1.constructor===Person
true
p1.constructor===Object
false
p1 instanceof Person
true
相关文章
将Url进行编码,前台JS需要使用这段内容,这时候就需要解码了2010-01-01
下面小编就为大家带来一篇原生JS 购物车及购物页面的cookie使用方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-08-08
下面小编就为大家带来一篇基于构造函数的五种继承方法小结。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-07-07
这篇文章主要介绍了wx-charts 微信小程序图表插件的具体使用，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-08-08
这篇文章主要介绍了js控制div弹出层实现方法,可实现点击链接弹出div浮动层,且背景色变暗的效果,是一款非常实用的特效源码,需要的朋友可以参考下2015-05-05
js之encodeURI、encodeURIComponent、decodeURI、decodeURIComponent
这篇文章主要介绍了js之encodeURI、encodeURIComponent、decodeURI、decodeURIComponent的使用，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-04-04
select 或text的onchange事件需要手动改变select或text的值才能触发，下面有个不错的方法可以通过js触发select onchange事件2014-08-08
这篇文章主要为大家详细介绍了基于vue实现可搜索下拉框定制组件，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2018-06-06
这篇文章主要介绍了JS弹性运动实现方法,结合实例形式分析了JS实现弹性运动的原理、相关技术细节与实现技巧,需要的朋友可以参考下2016-12-12
这篇文章主要介绍了JavaScript实现显示函数调用堆栈的方法,实例分析了JavaScript显示函数调用堆栈的具体作用与使用方法,需要的朋友可以参考下2016-04-04
最新评论