首页 > 代码库 > Javascript中的对象(一)

Javascript中的对象(一)

Javascript是基于对象模型设计的一种编程语言,它的核心(ECMAScript)具有非常强大和灵活的面向对象编程的能力。

  1. 什么是对象?

    在javascript中,对象是一个拥有属性和类型的独立实体。ECMA-262 把对象(object)定义为"属性的无序集合,每个属性存放一个原始值、对象或函数”。

    我们拿它和一个杯子做下类比。一个杯子是一个对象(物体),拥有属性。杯子有颜色,图案,重量,由什么材质构成等等。同样,javascript对象也有属性来定义它的特征。杯子也具有某些功能,比如说能够容纳一定量的液体。同理,Javascript对象也有方法来定义它的功能。

    所有的原生类型除了 null 与 undefined 之外都被当作对象。它们可以被赋予属性(某些类型的被赋予的属性不能被持久化),并且它们都有对象的全部特征。

  2. Javascript有哪些对象?

    JavaScript 拥有一系列预定义的对象和宿主应用提供的一些对象,在这里我们只介绍Javascript内置的对象,具体按照类别可以分成:

    • 全局常量: Infinity, NaN, undefined, null
    • 全局方法: eval(), isFinite(), isNaN(), parseFloat(), parseInt(),decodeURI(),decodeURIComponent(), encodeURI(), encodeURIComponent()
    • 基本对象:Object, Function, Boolean, Error, 
    • 数字日期:Number, Math, Date
    • 文字处理: String, RegExp
    • 数组集合: Array

    当然用户也可以创建对象。

  3. Javascript中对象怎么定义?

    从  JavaScript 1.2 之后,你可以通过对象初始化器(Object Initializer)创建对象。或者你可以创建一个构造函数并使用该函数和 new 操作符初始化对象。

    • 使用对象初始化器

      通过对象初始化器创建对象的语法如下:

      var obj = { property_1:   value_1,   // property_# may be an identifier...            2:   value_2,   // or a number...            // ...,            "property n": value_n }; // or a string

      这里 obj 是新对象的名称,每一个 property_i 是一个标识符(可以是一个名称、数字或字符串),并且每个 value_i 是一个其值将被赋予 property_的表达式。obj 与赋值是可选的;如果你不需要在其他地方引用对象,你就不需要将它赋给一个变量。(注意在接受一条语句的地方,你可能需要将对象定义文本括在括号里,从而避免将这些文本与块代码相混淆)

      对象初始化器是表达式,新的对象在这些表达式出现的地方被创建出来,所以说即使完全相同的对象初始化表达式所创建的出来的对象也是不等的。就好像调用new Object()创建不同的对象实体一样。

      下面列子创建出cup对象,具有三个属性。我们注意到属性design也是一个具有属性的对象。

          var Cup = {        color: "white", //default value of properties        weight: 0.5,        material: "china",        design: {            color: "pink",            mark: "rose"        },        fill: function (liquid, volumn) {            //todo            console.log("The " + this.color +  " and " + this.material +  " cup is filled with " + volumn + " litre " + liquid + ".");        }    }

      在Javascript 1.1版本以及之前版本,我们不能使用对象初始化器来创建对象,只能使用下面的方法来创建对象。

    • 使用构造函数创建对象

      你可以通过两步来创建对象:

      • 通过创建一个构造函数来定义对象的类型。首字母大写是非常普遍而且很恰当的惯用法。
      • 通过new创建对象实例。

      为了定义对象类型,为对象类型创建一个函数以声明类型的名称、属性和方法。例如,要创建一个cup对象,我们可以使用如下的函数:

          function Cup(color, weight, material, designColor, markImage) {        this.color = color;        this.weight = weight;        this.material = material;        this.design = { color: designColor, mark: markImage };        this.fill = function (liquid, volumn) {            //todo            console.log("The " + this.color + "  and " + this.material + " cup is filled with" + volumn + " litre " + liquid + ".");        }    }

      现在你可以象这样创建一个 mycup 对象: 

      var mycar = new Cup("white", 0.5, "china", "pink", "rose");

      该创建了 mycup 并且将指定的值赋给它的属性。因而 mycup.color 的值是字符串 "whhite", mycar.weight 的值是0.5(此处省略重量单位),依此类推。

      你可以通过调用 new 创建任意数量的 car 对象。例如:

      var lilicup = new Car("red", 0.4, "plastic", "blue", "girl"); var raincup = new Car("grown", 0.4, "glass", "green", "tree");
    • 使用Object.create(ECMAScript5及之后支持)

      对象也可以用 Object.create 方法创建。该方法非常有用,因为它允许你为创建的对象选择其原型对象,而不用定义一个构造函数。

      Object.create(proto[, propertiesObject])

       proto是指所创建对象的原型对象,propertiesObject是一个对象值,可以包含若干个属性。

          var Cup = {        color: "white", //default value of properties        weight: 0.5,        material: "china",        design: {            color: "pink",            mark: "rose"        },        fill: function (liquid, volumn) {            //todo            console.log("The " + this.color +  " and " + this.material +  " cup is filled with " + volumn + " litre " + liquid + ".");        }    }    //create new cup type called mycup    var mycup = Object.create(Cup);    mycup.fill("water", 0.2); //output: The white and china cup is filled with 0.2 litre water.    var lilycup = Object.create(Cup);    lilycup.color = "red";    lilycup.material = "plastic";    lilycup.fill("apple juice", 0.3); //Output: The red and plastic cup is filled with 0.3 litre apple juice.
  4. 如何使用对象?

    当构建好一个对象后,我们就可以访问对象的属性和方法:

    objectName.propertyNameobjectName.methodName();

     关于这个使用我们在上面sample里面已经使用过了,例如

    lilycup.material = "plastic";

    lilycup.fill("apple juice", 0.3); 。

关于对象的继承以及对象的几个主要方法我们将在下一篇文章里介绍。

Javascript中的对象(一)