JavaScriptのオブジェクトの基本

JavaScriptのオブジェクトの基本

JavaScriptのオブジェクト、オブジェクトの作成モード、コンストラクタ、包装などの基本的な形

Formatオブジェクト

  1. 基本フォーマット

    使用してオブジェクトの{}ラッピング、宣言するために、キーと値のプロパティの内部を

  2. var teacher = {
        name: "pgjett",
        age: "22",
        teach: function () {
            console.log("I teach javascript");
        },
        drink: function () {
            console.log("I drink beer");
        }
    }

オブジェクトのプロパティ

  1. 削除の属性を変更して再検索

    var teacher = {
        name: "pgjett",
        var teacher = {
            name: "pgjett",
            age: "22",
            teach: function() {
                console.log("I teach javascript");
            },
            drink: function() {
                console.log("I drink beer");
            }
        }
        // 增加
        teacher.smook = function(){
            console.log("I smook");
        }
        // 删除
        delete teacher.name;
        // 改变
        teacher.teach =function() {
            console.log("I teach java");
        }
        // 查找/访问
        console.log(teacher.name);  
        console.log(teacher["name"]);
        // 最早的 JS 引擎使用 obj["name"] 访问
        // 使用 obj.name 会自动转换成 obj["name"]
  2. オブジェクトアクセス方法プロパティ

    通常、通常の関数呼び出し機能、オブジェクト内の関数と呼ばれる方法

    var teacher = {
        name: "pgjett",
        age: "22",
        weight: "65",
        teach: function() {
            console.log("I teach javascript");
        },
        eat: function() {
            this.weight++;
            console.log("I eat, my weight is " + this.weight);
        }
    }
    teacher.eat();
  3. パラメータを持つオブジェクトのメソッド

    var attendance = {
        students: [],
        join: function(name) {
            this.students.push(name);
            console.log(name + " 已到课");
        },
        leave: function(name) {
            var idx = this.students.indexOf(name);
            if (idx != -1) {
                this.students.splice(idx, 1);
                console.log(name + "早退");
            }
        }
    }
    attendance.join("张三");
    attendance.join("李四");
    attendance.join("王五");
    attendance.join("赵六");
    attendance.join("孙七");
    attendance.leave("李四");
    // 张三 已到课
    // 李四 已到课
    // 王五 已到课
    // 赵六 已到课
    // 孙七 已到课
    // 李四早退

オブジェクトを作成する方法

  1. オブジェクトリテラル

    また、直接の目標量として知られています

    var obj = {
        name: "Jett",
        age: 22""
    }
  2. 内蔵のコンストラクタ

    直接オブジェクトの量との差はないと、新しいオブジェクトを使用して()

    var obj = new Object();
    obj.name = "Jett";
    obj.age = "22";
  3. カスタムコンストラクタ

    カスタムコンストラクタキャメルケース大、新しいオブジェクトインスタンス、および新しい異なるターゲットの例を作成することによって、彼らは自分の属性を持っています

    カスタムJavaScriptのコンストラクタモジュラー、プラグインのの重要な部分であります

    function Teacher(){
        this.name = "Jett";
        this.age = 22;
        this.teach =function(){
            console.log("I teach javascipt");
        }
    }
    var teacher1 = new Teacher();
    var teacher2 = new Teacher();
    teacher2.name = "John";
    console.log(teacher1);
    console.log(teacher2);
    // Teacher{name: "Jett", age: 22, teach: teach(){}}
    // Teacher{name: "John", age: 22, teach: teach(){}}

    渡されたカスタムコンストラクタ引数

    function Teacher(opt) {
        this.name = opt.name
        this.age = opt.age;
        this.teach = function() {
            console.log("I teach " + opt.course);
        }
    }
    var teacher1 = new Teacher({
        name: "Jett",
        age: 22,
        course: "javascript"
    });
    var teacher2 = new Teacher({
        name: "John",
        age: 25,
        course: "java"
    });

コンストラクタ原理

  1. この時点

    、事前コンパイラの理論によると、この時点でウィンドウを新たに、直接実行を使用しないでください。

    function Car() {
        this.color = "red";
        this.brand = "BMW";
    }
    Car();
    console.log(window.color);
    // red

    新しいオブジェクトの使用例、インスタンスにこのポイント

    function Car() {
        this.color = "red";
        this.brand = "BMW";
    }
    var car = new Car();
    console.log(car.color);
  2. この変化の過程

    ときに新しいコンストラクタ、この構成は実行される機能と同等です、それはデフォルトプロパティに、このポイントでAOを持っています

    実行されると、

    this.color = "red";
    this.brand = "BMW";

    この上のプロパティと同等のものを追加します。

    新しいキーワードを使用した後、このスローは、参照に割り当てられます

    これは、オブジェクトのインスタンスで、このインスタンスは、色、ブランドの属性にアクセスすることができます

  3. コンストラクタ復帰

    新しいデフォルトコンストラクタが暗黙のうちにこれを返します

    明示的なプリミティブ値を返す場合は、インスタンスオブジェクトは影響を受けています

    明示RETRN基準値であれば、新たな点の基準値の例に

    function Car() {
        this.color = "red";
        this.brand = "BMW";
    
        return 1;
    }
    var car = new Car();
    console.log(car.color);
    // red

ラッパークラス

  1. コンストラクタによって作成されたデジタルオブジェクトは、プロパティを設定することができます

    計算で自動的にアンパック

    同様にそこに文字列、ブール

    var a = new Number(1);
    a.name = "a";
    console.log(a);
    console.log(a + 1);
    // 打印
    // Number{1, name: "a"}
    // 2

    、各訪問は、オブジェクトの適切な型にパッケージ化されるカスタムメソッドとプロパティの元の値は、一時的なコンテナである、破壊の実装が再び訪れ、再パッケージ化した後、唯一の未定義へのアクセス権を持っています

    var a = 1;
    a.name = "a"; 
    // js 引擎将 a 包装成数字对象,
    // 即 new Number(a).len = 3
    // 临时容器没有变量保存,执行 delete,删除该 len 属性
    console.log(a.name);
    // 即 console.log(new Number(a).len)
    // 打印 undefined
  2. ストリング

    元の文字列の長さの属性値が実際に文字列オブジェクトアクセスのlengthプロパティにパッケージ化されていません

    // js 引擎将 "123" 包装成字符串对象
    var str = "123";
    str.length = 1; 
    // 即 new String(str).length = 1;
    console.log(str.length);
    // 即 console.log(new String(str).length)
    // 打印 3

オブジェクトチェーンの呼び出し

通过 return this 将对象抛出,以调用其他函数

```javascript
var sched = {
    marning:function(){
        console.log("marning studying");
        return this;
    },
    noon:function(){
        console.log("noon sleeping");
        return this;
    },
    afternoon:function(){
        console.log("afernoon shopping");
        return this;
    }
}
sched.marning().noon().afternoon();
```

オブジェクトの列挙

  1. 以下のためのオブジェクトのプロパティを横断中

    var obj = {
        name: "Jett",
        age: 22,
        address: "安徽"
    }
    for( var key in obj) {
        console.log(key, obj[key]);
    }
    // name Jett
    // age 22
    // address 安徽
  2. 判決でオブジェクトとプロパティがあります

    var obj = {
            name: "Jett",
            age: 22,
            address: "安徽"
        }
    console.log("name" in obj);
    // true

おすすめ

転載: www.cnblogs.com/pgjett/p/12529540.html