JavaScript高级程序设计——从头学(3)

对象基础

1、OOP

2、对象应用

3、对象的类型

  3.1 本地对象

    ECMA-262t将本地对象(native object)定义为“独立于宿主环境的ECMAScript实现提供的对象”。简单的来说,本地对象是ECMA-262定义的类(引用类型)。

    它们包括:

    Object    Function  Array  String  Boolean

    Number   Date     RegExp Error   EvalError

    RangeError   ReferenceError  SyntaxError    TypeError    URIError

  3.2 内置对象

    ECMA-262把内置对象(built-in object)定义为“由ECMAScript实现提供的、独立于宿主环境的所有对象,在ECMAScript程序开始执行时出现”。

    ECMA-262只定义了两个内置对象:Global 和 Math 。内置对象也是本地对象

    在ECMAScript中,不存在独立的函数,所有函数都必须是某个对象的方法。

      encodeURI():不对URI中的特殊字符进行编码,如冒号、前斜杠、问号和英镑符号。

      encodeURIComponent():对它发现的所有非标准字符进行编码。 这两个方法用于编码传递给浏览器的URI。

      decodeURI():

      decodeURIComponent():

      eval():最强大的方法,接受一个参数,即要执行的ECMAScript(或JavaScript)字符串。

  3.3 宿主对象

    Host Object: 由ECMAScript 实现的宿主环境提供的对象。所有BOM和DOM对象都是宿主对象。

4、作用域

  变量的适用范围。

  4.1 公用、受保护和私有作用域

    私有作用域的属性只能在对象内部访问,对于外部世界来说,这些属性并不存在。这也意味着类定义了私有属性和方法,它的子类也不能访问这些属性和方法。

  4.2 静态作用域并非静态的y

    静态作用域定义的属性和方法任何时候都能从同一个位置访问。在Java中,类具有静态属性和方法,无需实例化该类的对象,就可以访问这些属性和方法。

  4.3 关键字this

    this总是指向调用该方法的对象。

    为什么使用this呢?因为在实例化对象时,总是不能确定开发者会使用什么样的变量名。

    使用this可以在多个地方重用同一个函数。

    funtion showColor(){
      alert(this.color)

    }

    var oCar1 = new object;

    oCar1.color = "red";

    oCar1.showColor = showColor;

    var oCar2 = new object;

    oCar2.color = "blue";

    oCar2.showColor = showColor;

    oCar1.showColor(); //"red"

    oCar2.showColor();//"blue"

    调用oCar1.showColor()时,this指向oCar1;调用oCar2.showColor()时,this指向oCar2。

    引用对象的属性时,必须使用this关键字。如果不用对象或this引用变量,ECMAScript就会把它当作局部变量或全局变量。

    然后该函数将查找名为color的局部变量或全局变量。

5、定义类或对象

  1,工厂方式

    对象的属性可在对象创建后动态定义,因此许多开发者在初次引入JavaScript时编写类似下面的代码:

      var oCar = new Object();

      oCar.color = "red";

      oCar.showColor = function () {

        alert(this.color);

      };

    首先,创建对象oCar。然后设置几个属性:颜色。第二个属性是指向函数的指针,意味着该属性是个方法。执行这段代码就可以使用对象oCar.

    问题是可能需要创建多个car实例!!!!

    要解决这个问题,开发者创造了能创建并返回特定类型的对象的工厂函数。

    function createCar(sColor ) {

      var oTempCar = new Object();

      oTempCar.color = sColor;

      oTempCar.showColor = function () {

        console.log(this.color)

      };

      return oTempCar;

    };

    var oCar1 = createCar("red");

    var oCar2 = createCar("blue");

    问题是,在重复创建对象时,会存在重复创建函数oTempCar.showColor()对象的问题。

  2、构造函数方式

    构造函数看起来很像工厂函数,但构造函数的名字的首字母要大写。构造函数内部无创建对象,而是使用this关键字,因此不需要return一个对象出来。

    function Car(sColor) {

      this.color = sColor;

      this.showColor = function(){

        alert(this.color);

      };

    };

    问题是,构造函数也会重复生成函数,为每个对象都创建一个独立的函数。

  3、原型方式

    利用对象的prototype属性,可把看成创建对象新对象所依赖的原型。用空构造函数来设置类名,然后所有的属性和方法都被直接赋予prototype属性。

    function Car() {

    };

    Car.prototype.color = "red";

    Car.prototype.queue = new Array('Hello');

    Car.prototype.showColor = function() {

      console.log(this.color);

    };

    var oCar1 = new Car();

    var oCar2 = new Car();

    首先定义构造函数(Car),通过给Car的prototype属性添加属性去定义Car 对象的属性。调用new Car()时,原型的所有的属性都被立即赋予要创建的对象。意味着所有Car实例存放的

    都是指向showColor()函数的指针。

    问题是,使用原型方式时,不能通过构造函数传递参数来初始化属性的值。当属性指向对象而不是函数时,会有值得注意的问题。

    oCar1.queue.push("world!");

    console.log(oCar1.queue); //output:【 hello,world!】

    console.log(oCar2.queue);//output:【 hello,world!】

  4、混合的构造函数/原型方式

    function Car(sColor) {

      this.color = sColor;

      this.queue = new Array("Hello");

    };

    Car.prototype.showColor = function() { 

      console.log(this.color);

    }

    var oCar1 = new Car("red");

    var oCar2 = new Car("blue");

    oCar1.queue.push("world!");

    console.log(oCar1.queue);//['hello','world!']

    console.log(oCar2.queue);//['hello']

  5、动态原型方法

6、修改对象

posted @ 2015-05-07 22:09  谷亚先  阅读(144)  评论(0编辑  收藏  举报