[JS]10オブジェクトスパイラル

16441 ワード
構文 js deepdive テキストリンク

オブジェクト

  • javascriptはオブジェクトベースのプログラミング言語であり、javascriptを構成するほとんどの「すべて」はオブジェクトである.
  • オブジェクトタイプは、様々なタイプの値を1単位で構成する複合材料構造であり、オブジェクトは変更可能な値である.
  • オブジェクトは、0個以上のPropertyからなる集合であり、Propertyはキーと値からなる.
    • var person = {
  name: 'lee',  //프로퍼티
  age: 20       //프로퍼티
  //age : 키 / 20 : 값
};
    ☝🏻 property値が関数である場合、メソッド(method)と呼ばれ、通常の関数を区別します.
  • Property:オブジェクトの状態を表す値(データ)
  • メソッド:Propertyの動作
    • を参照および操作可能

    オブジェクトテキストからオブジェクトを作成するには

  • オブジェクトテキストは、括弧内に0個以上のプロパティを定義します.
    • クラスを最初に定義し、新しい演算子呼び出しジェネレータを使用する必要がなく、
  • オブジェクトを作成できます.
  • 括弧内にPropertyが定義されていない場合、空のオブジェクトが生成されます.
    • var person = {
  name : 'lee',
  sayHello: function() {
    console.log(`Hello! my name is ${this.name}.`);
  }
};

console.log(type of person); //object
console.log(person); //{name: 'lee', sayHello: f}

    保証する

  • オブジェクトはpropertyの集合であり、propertyはキーと値から構成されます.
  • propertyがリストされている場合は、カンマで区切られ、最後のpropertyの後にカンマは使用されませんが、使用しても構いません.
    ☝🏻
  • Propertyキー:空の文字列を含むすべての文字列またはシンボル値
    ->propertyキーが識別子命名規則に従う名前の場合は、引用符を省略できます.
  • パーセント値:JavaScriptで使用可能なすべての値
    • var person = {
  firstname : 'nayeong', //식별자 네이밍 규칙을 준수하는 프로퍼티 키
  'last-name': 'Kim'     //식별자 네이밍 규칙을 준수하지 않는 프로퍼티 키
};
  • 文字列または文字列で計算できる式を使用してpropertyキーを動的に生成できます.この場合、カッコで囲む必要があります.
    • var obj = {};
var key = 'hello';

//ES5 : 프로퍼티 키 동적 생성
obj[key] = 'world';
//ES6 : 계산된 프로퍼티 이름
var obj = {[key]:'world'};
  • 既存のpropertyキーを繰り返し宣言すると、後で宣言されたpropertyが最初に宣言したpropertyが上書きされ、エラーは発生しません.

    • 特許アクセス

  • JavaScriptで使用可能な有効な名前の場合は、句点記号と括弧記号の両方を使用できます.
    • var person = {
  name : 'lee'
};

//마침표 표기법에 의한 프로퍼티 접근
console.log(person.name); //lee

//대괄호 표기법에 의한 프로퍼티 접근
console.log(person['name']; //lee
    ☝🏻 角カッコタグを使用する場合は、演算子の内部で指定されたPropertyキーは、引用符で囲まれた文字列でなければなりません.そうしないと、識別子として解釈されます.
    また、propertyキーがネーミングルールに従わない名前の場合は、四角カッコを使用する必要があります.

    プロパティ値の更新


    :既存のpropertyに値を割り当てると、property値がリフレッシュされます.
    var person = {
  name : 'lee'
};

person.name='kim';

console.log(person); // {name : 'kim'}

    Property動的作成


    :存在しないプロセスに値を割り当てると、プロセスが動的に作成され、追加され、値が割り当てられます.
    var person = {
  name : 'lee'
};

person.age=20;

console.log(person); // {name : 'lee', age:20 }

    プロパティの削除


    :delete演算子はオブジェクトのプロファイルを削除し、存在しないプロファイルを削除するとエラーなく無視されます.
    var person = {
  name : 'lee'
};

person.age=20;

delete person.age;

delete person.address;

console.log(person); // {name : 'lee'}
//객체에 address프로퍼티가 존재하지 않기 때문에 에러발생없이 그냥 무시되었다.

    ES 6に追加されたオブジェクト文字の拡張


    Propertyサムネイル表示


    :変数をproperty値として使用する場合、変数名がpropertyキーと同じ名前の場合はpropertyキーを省略できます.
    この場合、propertyキーは自動的に変数名として生成されます.
    let x = 1, y = 2;

const obj = {x, y};

console.log(obj); //{x:1, y:2}

    計算された構成名

    const prefix = 'prop';
let i = 0;

const obj = {
  [`${prefix}-${++i}`]: i,
  [`${prefix}-${++i}`]: i,
  [`${prefix}-${++i}`]: i
};

console.log(obj); // {prop-1:1, prop-2:2, prop-3:3}

    メソッド簡略表示

    //ES5
var obj = {
  name: 'lee',
  sayHi: function() {
    console.log('Hi! ' + this.name);
  }
};

obj.sayHi(); //Hi! lee

//ES6
const obj = {
  name: 'lee',
  //메서드 축약 표현
  sayHi() {
    console.log('Hi! ' + this.name);
  }
};

obj.sayHi(); //Hi! lee
    LeetCode: Clone Graph
    miniProject-小鬼書評-1(フラスコフォルダ構造、テンプレートコード)