资讯专栏INFORMATION COLUMN

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

marser / 2453人阅读

摘要:通过对象字面量方式创建对象我们可以直接在创建对象的时候添加功能或者首先定义一个空对象,然后添加属性和方法上面的空对象为什么打了双引号这只是一种简称而已。

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

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

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构造函数创建对象对比

字面量的优势:

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

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

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

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/jav...
http://lichking1201.github.io...

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/81712.html

相关文章

  • 对象字面量和构造函数创建对象区别

    摘要:如下两段代码,分别是使用对象字面量和构造函数创建对象。最后,总结下来就是函数对象是继承自对象的原型,有了函数对象,我们可以给函数的原型添加属性,这些属性保存在函数对象中,但是又不会影响其他对象。 看了这篇文章,可以帮助你理解如下内容: 1、向原型链上添加属性为什么用prototype,而一般不用__proto__ 2、javascript为什么要设置一个函数对象,他的作用是什么 3、更...

    0x584a 评论0 收藏0
  • 《JavaScript模式》读书笔记(二)字面量和构造函数

    摘要:对象字面量定义一个空对象这里的空指的是其自身属性为空,对象继承了的属性和方法添加属性方法完全删除属性方法自定义构造函数用操作符调用构造函数时,函数内部会发发生以下情况创建一个新对象,并且引用了该对象并继承了该函数的原型属性和方法被加入到的引 对象字面量 //定义一个空对象,这里的空指的是其自身属性为空,dog对象继承了Object.prototype的属性和方法 var dog={} ...

    _Zhao 评论0 收藏0
  • 关于创建对象三种写法 ---- 字面量,new构造器和Object.create()

    摘要:前言重新梳理一下发现以前说的有问题顺便比较两两写法之间的差异性使用对象字面量表示法函数字面量运行时间嵌套函数字面量调用方法函数字面量运行时间函数字面量运行时间使用操作符后跟构造函数详情可参考关于中的运算符构造函数与原型链一些理解构造函数原型 前言 PS:2018/04/14: 重新梳理一下发现以前说的有问题,顺便比较两两写法之间的差异性. 1、使用对象字面量表示法 console.ti...

    Jiavan 评论0 收藏0
  • 《javascript高级程序设计》第六章 读书笔记 之 javascript对象几种创建方式

    摘要:三种使用构造函数创建对象的方法和的作用都是在某个特殊对象的作用域中调用函数。这种方式还支持向构造函数传递参数。叫法上把函数叫做构造函数,其他无区别适用情境可以在特殊的情况下用来为对象创建构造函数。 一、工厂模式 工厂模式:使用字面量和object构造函数会有很多重复代码,在此基础上改进showImg(https://segmentfault.com/img/bVbmKxb?w=456&...

    xiaotianyi 评论0 收藏0
  • 闲话JavaScript数据类型

    摘要:支持的类型的内置数据类型罗列如下自定义自定义这三种类型的赋值是同类似的。这根不同,这因为是没有包装类新增的基本类型,只支持函数式赋值,不支持字面量和函数构造。 JavaScript支持的类型 JS的内置数据类型罗列如下: undefined null bool number string function object Function Date ...

    jerryloveemily 评论0 收藏0

发表评论

0条评论

marser

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<