js中Object.create()、new Object()和{}创建对象的区别

文章类型:Javascript

发布者:hp

发布时间:2023-03-25

这三种创建对象方式,常用对象字面量方式,执行效率更高

区别

一:对象字面量{}

本质和new Object()并无区别,默认都是继承了Object对象上的prototype,书写更加简单

var objA = {};
objA.name = 'a';
objA.say= function() {
console.log(`My name is ${this.name} !`);
}

objA.say();
console.log(objA.__proto__ === Object.prototype); // true
console.log(objA instanceof Object); // true

二:Object.create()

是将对象继承到原型链上,然后可以通过对象实例的__proto__属性进行访问原型链上的属性

Object.create(null) 创建的对象是一个空对象,没有继承 Object.prototype 原型链上的属性或者方法

参数:

1:proto必填参数,是新对象的原型对象,如果这个参数是null,那新对象就彻彻底底是个空对象,没有继承原型上的属性和方法

2:properties可选参数,指定要添加到新对象上的可枚举的属性继承的属性可以被重写,说白了就是新的一个原型上的属性和方法,然后才是继续链式__proto__

let a=Object.create(null)

const person = {
isHuman: false,
printIntroduction: function () {
console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);
}
};
const me = Object.create(person);
me.name = "Matthew";
me.isHuman = true;
me.printIntroduction();

三:new Object()

创建一个新对象,使用现有的对象来提供新创建的对象的__proto__。

new操作符主要做

1: 创建一个空对象

var obj =new Object();

2:obj的__proto__指向构造函数的prototype

obj.__proto__ = F.prototype;

3:把构造函数的this指向obj,并执行构造函数把结果赋值给result

var result = F.call(obj);

4:根据构造函数返回值类型进行返回

a:引用类型 =>返回引用类型的对象

b:值类型=>返回空对象

if (typeof(result) === 'object') {
objB = result;
} else {
objB = obj;
}

new Object()方式创建对象


var objB = new Object();
// var objB = Object();
objB.name = 'b';
objB.sayName = function() {
console.log(`My name is ${this.name} !`);
}
objB.sayName();
console.log(objB.__proto__ === Object.prototype); // true
console.log(objB instanceof Object); // true

总结:

1:字面量和new关键字,原型指向Object.prototype,继承内置对象Object

2:Object.create(arg, pro)创建的对象的原型取决于arg,arg为null,是空对象,没有原型,不继承;arg为对象,原型指向指定对象,继承指定对象

3:Object.create创建空对象方式可以用来提升代码性能,弃用不用的链式原型上的属性和方法