对象字面量和构造函数创建对象详解
1、向原型链上添加属性为什么用prototype,而一般不用__proto__
2、javascript为什么要设置一个函数对象,他的作用是什么
3、更深层次了解原型链
如下两段代码,分别是使用对象字面量和构造函数创建对象。
代码段1:
var a={"name":"nihao"}; console.log(a);
代码段2:
var a=function(name){ this.name=name; }; var b= new a("nihao"); console.log(b);
首先,我们需要知道:
1、函数对象的原型是对象(原型链为:实例,通过new构造函数-->函数对象-->对象-->null)
2、函数有prototype属性,而对象没有
然后,在某些场景下,我们有一个公共的属性,需要多个新建的对象去继承,这个时候就能体现出函数对象的特点了,我们看下代码:
1、使用构造器
var a=function(name){ this.name=name; }; a.prototype.sex="nan"; var b= new a("nihao"); console.log(b); console.log(b.name); console.log(b.sex); var c=new a("test"); console.log(c); console.log(c.name); console.log(c.sex);
如上,可以很容易的实现属性或方法的继承,在控制台打印上述代码,可以很容易看到原型链是这样的(以对象b为例):对象b-->函数对象-->对象-->null
2、使用对象字面量
使用对象字面量创建的是对象,他没有prototype属性,所以我们只能通过__proto__,但是在对象上使用__proto__可能会导致一些问题的出现。代码如下:
var a={"name":"nihao"}; a.__proto__.sex="nan"; console.log(a); console.log(a.name); console.log(a.sex); var b={}; console.log(b); console.log(b.name); console.log(b.sex);
如上,运行上面代码,可以很容易得到运行结果:
{name: "nihao"} nihao nan {} undefined nan
哎,这个就很奇怪了,b对象明明设置的为空啊?这是因为在执行a.__proto__.sex="nan";时候,程序向对象的原型上添加了一个属性sex,而b是对象也是继承的对象的原型,多以导致了这个问题的出现。
最后,总结下来就是:
函数对象是继承自对象的原型,有了函数对象,我们可以给函数的原型添加属性,这些属性保存在函数对象中,但是又不会影响其他对象。
相关推荐:
JavaScript中对这两种对象字面量(json)的操作方式有何不同?
Javascript 中 class、构造函数、工厂函数详解
以上就是对象字面量和构造函数创建对象详解的详细内容,更多请关注其它相关文章!
推荐阅读
-
javascript中如何用构造函数创建对象以及子类的继承?
-
javaWeb学习之创建对象,构造函数,原型对象,constructor讲解
-
javascript工厂模式和构造函数模式创建对象方法解析
-
Python面向对象程序设计构造函数和析构函数用法分析
-
net学习之类与对象、new关键字、构造函数、常量和只读变量、枚举、结构、垃圾回收、静态成员、静态类等
-
JS高级---构造函数,实例对象和原型对象,三者关系
-
JS高级---工厂模式创建对象和自定义构造函数创建对象的区别
-
dotnet C# 只创建对象不调用构造函数方法
-
IO,File对象-构造函数和常用方法
-
详解js创建对象的几种方式和对象方法