美文网首页
JavaScript - Object

JavaScript - Object

作者: FoxLayla | 来源:发表于2019-02-17 23:13 被阅读1次

    Object

    由一系列 键值对 组成的变量。其基本形式为:

    var object = {
        key1: value1,
        key2: value2,
        key3: value3,
    }
    

    键值对的值可以是任何数据类型,包括:number, string, array, boolean, object, function 等。这些键值对称为对象的 属性,其中function也称为对象的 方法。对象的名字称为 命名空间

    JavaScript 中的常见对象

    • String
    • Array
    • Function
    • Window
    • Document
    • Math
    • Date

    创建对象的方法

    1. var object = {};

    2. var object = new Object;

    3. 使用自定义构造函数创建对象

      function constructorFunction() {
          this.key = value;
          ...
      }
      var object = new constructorFunction();
      
    4. var object = Object.create(protoObject);

      即以protoObject为原型创建一个新对象objectobject会继承protoObject的属性。

      object.__proto__; // return protoObject
      
    5. 利用constructor属性创建对象:

      var object = new existingObject.constructor(value1, value2, ...)
      

    为对象增加属性

    object.key = value;

    删除对象的属性

    delete object.key;

    访问对象的属性

    1. .来访问对象的属性:object.key
    2. []来访问对象的属性:object['key']

    this 对象

    this 指代的是当前代码行的上下文。

    The this keyword refers to the current object the code is being written inside.

    It will always ensure that the correct values are used when a member's context changes.

    面向对象编程(Object-oriented programming)

    The basic idea of OOP is that we use objects to model real world things that we want to represent inside our programs, and/or provide a simple way to access functionality that would otherwise be hard or impossible to make use of.

    • 抽象:创建一个简单的模型来描述一个复杂的事物
    • 实例化:可以利用类的 构造函数 来将对象实例化
    • 多态性:可以通过一个基类来创建很多子类,子类可以继承基类的属性

    构造函数

    构造函数具有函数的形式,但不返回任何值。可以按照如下方式创建一个构造函数:

    function constructorFunction() {
        this.property1 = value1;
        this.property2 = value2;
        this.property3 = function() {};
    }
    

    利用构造函数创建对象的方式为:

    var object = new constructorFunction();

    对象原型(Object prototype)

    属性和方法是在对象的构造函数的原型属性上定义的,而不是对象实例本身。

    • 对象的原型:指每个对象实例的原型
    • 构造函数的原型属性:指构造函数上的属性

    对象会继承其原型的所有属性(该对象并不是复制了其原型的属性,而是通过原型链访问了原型的属性)。

    利用 __proto__可以访问对象的构造函数的原型对象。

    继承链是动态更新的,即当原型的属性被修改后,所有该原型派生出的对象实例都能访问到该修改。

    原型属性

    对于Object这个对象来说,其能够被继承的属性是定义在它的原型上的属性,即可以以Object.prototype.来访问的属性。这些属性是定义在Object()构造函数上的属性。

    构造函数的属性

    每个构造函数都有一个原型属性,其值是一个包含constructor属性的 对象。该属性指向原始构造函数。

    • 由对象实例获得其构造函数:object.constructor()
    • 获得对象实例的构造函数的名称:object.constructor.name

    在构造函数中定义属性是比较好的方式。实际上,对象定义的一个最常见模式是 在构造函数内定义属性、在原型上定义方法。这样可以使代码更易读。

    // 定义属性
    function constructorFunction () {
        // property definitions
        ...
    }
    // 定义方法
    constructorFunction.prototype.fun1 = function () {...};
    constructorFunction.prototype.fun2 = function () {...};
    ...
    

    继承

    可以利用已有的构造函数派生新的构造函数

    1. 利用call()函数继承已有构造函数的属性

      // 已有的构造函数
      function originFunction() {
          this.property1 = value1;
          this.property2 = value2;
          ...
      }
      // 新构造函数
      function newFunction() {
          originFunction.call(this, [...arguments]);
          this.newProperty1 = newValue1;
          ...
      }
      

      通过这种方式即定义一个新的构造函数,它有一个原型属性,默认情况下它只包含对构造函数本身的引用,而不包含originFunction()构造函数的原型属性。

    2. 利用create()函数继承已有构造函数的方法

      newFunction.prototype = Object.create(originFunction.prototype);
      

      通过这种方式newFunction构造函数将originFunction构造函数的原型作为了自己的原型,并继承了其所有的方法。

      newFunction.prototype.constructor现在为 originFunction(),因为我们将newFunction.prototype 指向了一个继承了originFunction.prototype属性的对象。

      为了修正这一问题,需要进行如下操作,以将newFunction.prototype.constructor修正为newFunction()

      Object.defineProperty(newFunction.prototype, 'constructor', { 
          value: newFunction, 
          enumerable: false, // so that it does not appear in 'for in' loop
          writable: true });
      

    相关文章

      网友评论

          本文标题:JavaScript - Object

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