JavaScript 对象字面量(object literal)

什么是字面量

用来为变量赋值时的常数量

对象字面量

对象字面值是封闭在花括号对({})中的一个对象的零个或多个”属性名:值”列表。

var person={ 
    name:"Jack", 
    age:10,
    5:true  
};
  • 在这个例子中,左边的花括号({)表示对象字面量的开始,因为它出现在了表达式上下文(expression context)中。
  • JavaScript 中的表达式上下文(expression context)指的是能够返回一个值(表达式)。
  • 赋值操作符(=)表示后面是一个值,所以左花括号在这里表示一个表达式的开始。
  • 同样的花括号,如果出现在一个语句上下文(statement context)中,例如跟在 if语句条件的后面,则表示一个语句块的开始。
  • 例子中定义了name属性,之后是一个冒号,再后面是这个属性的值(name:"Jack")。在对象字面量中,使用逗号来分隔不同的属性,因此”Jack”后面是一个逗号。但是age属性的值 10 的后面不能添加逗号,因为 age 是这个对象的最后一个属性。在最后一个属性后面添加逗号,会在 IE7及更早版本和Opera 中导致错误。 不要忘记结束大括号右边的(

对象字面量的值可以是任何数据类型包括数组字面量,函数,嵌套的对象字面量

var Swapper = {
    // 数组字面量(用逗号分隔,所有都要加引号)
    images: ["smile.gif", "grim.gif", "frown.gif", "bomb.gif"],
    pos: { //嵌套对象字面量
        x: 40,
        y: 300
    },
    onSwap: function() { //函数
    }
};
  • 如果有任何的语法规则被打破,如缺少逗号或冒号或大括号,将会触发JavaScript错误。
  • 浏览器的错误信息在指出对象字面量语法错误的位置一般有帮助,但他们不一定会在指出错误的性质完全准确。

在使用对象字面量时,属性名也可以用字符串

var person={
    "name":"Jack",
    "age":29,
    5:true
};

  • 上述例子会创建一个对象,包含三个属性,但这里的数值属性名会自动转换为字符串。
  • 在通过对象字面量定义对象时,实际上不会调用Object构造函数(Firefox 2及更早版本会调用Object构造函数;但Firefox3之后就不会了)
  • 这是因为字面量法创建对象强调该对象仅是一个可变的hash映射,而不是从对象中提取的属性或方法。
    创建对象的两种方法:
    使用字面量方法创建对象:var student = {name: "张三"};
    使用内置构造函数创建对象:var student = new Object(); student.name = "张三"
    应该尽量使用字面量发创建对象,其显著优点在于它只需要输入更少的字符,除此之外,还有几点原因:选择字面量法创建对象强调该对象仅是一个可变的hash映射,而不是从对象中提取的属性或方法。
    与使用Object构造函数相比,使用字面量好处在于它并没有作用域解析。因为可能当以同样的名字创建一个局部函数,解释器需要从栈中调用Object(0的位置开始一直向上查询作用域链,直到发现全局Object构造函数。)
    构造函数Object仅接受一个参数,并且还依赖传递的值,该Object()可能会委派另一个内置函数来创建对象,并且返回了一个并非期望的不同对象。(还不确定这句话是否是对的,如果不对希望广大网友帮忙改正)如将数字、字符串、布尔值当做参数传递给Object构造函数,其结果是获得了以不同构造函数所创建的对象,例如:
    var oschina = new Object(1); ochina.constructor
    ochina.constructorNumber;传递的值是动态的,直到运行时才确定其类型,这种行为会导致意想不到的结果。
  • 虽然可以使用前面介绍的任何一种方法来定义对象,但开发人员更青睐对象字面量语法,因为这种语法要求的代码量少,而且能够给人封装数据的感觉。实际上,对象字面量也是向函数传递大量可选参数的首选方式。

猜你喜欢

转载自blog.csdn.net/WuLex/article/details/88691449
今日推荐