美文网首页Web 前端开发 技术干货让前端飞
通过对象字面量和构造函数创建对象的区别:

通过对象字面量和构造函数创建对象的区别:

作者: var_Change | 来源:发表于2017-02-20 16:34 被阅读0次

通过对象字面量方式创建对象:

我们可以直接在创建对象的时候添加功能

var person = {
    name : 'zqq',
    age : 28,
    say : function(){
        return "hello";
    }
};

或者

首先定义一个"空对象",然后添加属性和方法

var person = {};
person.name = 'zqq';
person.age = 28;
person.say = function(){
    return "hello";
}

上面的"空对象"为什么打了双引号?这只是一种简称而已。在js中根本不存在真正的空对象,理解这一点至关重要!即使时最简单的{}对象也会包含从Object.prototype继承而来的属性和方法。我们提到的"空对象"只是说这个对象没有自有属性,不考虑它是否有继承而来的属性

通过构造函数创建对象

var person =  new Object();//没传参数的话,()可以省略
person.name = 'zqq';
person.age = 28;

对象字面量vs构造函数创建对象对比

字面量的优势:

  1. 它的代码量更少,更易读;

  2. 它可以强调对象就是一个简单的可变的散列表,而不必一定派生自某个类;

  3. 对象字面量运行速度更快,因为它们可以在解析的时候被优化:它们不需要<a href="http://www.csdn.net/article/2011-09-07/304152">"作用域解析(scope resolution)"</a>;因为存在我们创建了一个同名的构造函数Object()的可能,当我们调用Object()的时候,解析器需要顺着作用域链从当前作用域开始查找,如果在当前作用域找到了名为Object()的函数就执行,如果没找到,就继续顺着作用域链往上照,直到找到全局Object()构造函数为止

  4. Object()构造函数可以接收参数,通过这个参数可以把对象实例的创建过程委托给另一个内置构造函数,并返回另外一个对象实例,而这往往不是你想要的。

下面的示例代码中展示了给new Object()传入不同的参数(数字、字符串和布尔值),最终得到的对象是由不同的构造函数生成的:

// 空对象
var o = new Object();
console.log(o.constructor === Object); // true

// 数值对象
var o = new Object(1);
console.log(o.constructor === Number); // true
console.log(o.toFixed(2)); // "1.00"

// 字符串对象
var o = new Object("I am a string");
console.log(o.constructor === String); // true
// 普通对象没有substring()方法,但字符串对象有
console.log(typeof o.substring); // "function"

// 布尔值对象
var o = new Object(true);
console.log(o.constructor === Boolean); // true

Object()构造函数的这种特性会导致一些意想不到的结果,特别是当参数不确定的时候

综上所述:尽量用对象字面量的方式来创建对象

参考资料:
https://github.com/TooBug/javascript.patterns/blob/master/chapter3.markdown

http://lichking1201.github.io/2014/10/11/js-patterns-1.html

相关文章

  • JavaScript面向对象(二)

    创建对象的方式 通过构造函数 通过字面量 构造函数创建 字面量创建 添加删除对象属性 对象属性不一定必须在定义对象...

  • JavaScript创建对象方式及性能问题

    通过Object构造函数或者字面量创建对象 弊端:无论通过Object来创建对象, 还是通过字面量来创建对象都存在...

  • JS 创建对象的四种方式

    通过对象字面量来创建 通过 new Object() 创建对象 通过工厂函数来创建对象 通过构造函数来创建对象 工...

  • 链式操作

    对象字面量创建对象 构造函数创建对象 构造函数和原型一起创建对象 参考 JavaScript设计模式 --- 方法...

  • 08-JavaScript面向对象

    创建对象 JavaScript中如何创建对象 通过默认的Object这个类(构造函数)来创建 通过字面量来创建对象...

  • 面向对象1

    一、构造函数 对象的创建方法var obj = {} plainObject 对象的字面量/对象直接量构造函数...

  • 创建对象的方法

    对象字面量 new Object()创建对象 工厂函数创建对象 自定义构造函数 属性和方法 new关键字 构造函数...

  • 通过对象字面量和构造函数创建对象的区别:

    通过对象字面量方式创建对象: 我们可以直接在创建对象的时候添加功能 或者 首先定义一个"空对象",然后添加属性和方...

  • JavaScript 模式(三)

    JS字面量和构造函数 1.总体说明 尽量避免使用构造函数 按需创建对象方式,最适合选择字面量 2.字面量语法 对象...

  • 面向对象之创建对象--构造函数详解(二)

    普通创建对象和字面量创建对象不足之处:虽然 Object 构造函数或对象字面量都可以用来创建单个对象,但这些方式有...

网友评论

    本文标题:通过对象字面量和构造函数创建对象的区别:

    本文链接:https://www.haomeiwen.com/subject/pydewttx.html