jsオブジェクト属性は「.」[]アクセスとの違い


オブジェクトのプロパティの読み込みと設定には、次の2つの書き方があります.
(.)   : obj.attr 
([])  : obj[attr]

1、(.) ポイントオペレータ:静的.右側には、プロパティ名で命名された単純な識別子が必要です.属性名は識別子で表されます.識別子は、データ型ではない再jsプログラムに直接表示される必要があります.そのため、プログラムは変更できません.
2、([])中括弧オペレータ:動的.角カッコには、計算結果が文字列の式でなければなりません.属性名は文字列で表されます.文字列はjsのデータ型であり、プログラムの実行時に変更および作成できます.
主に以下の違いがあります.
[]変数は属性名またはアクセスとして使用できますが、ポイントメソッドは使用できません.[]変数でも文字列でもアクセスできますが、二重引用符が必要です.
var obj = {};
obj.name = '  ';
var myName = 'name';
 
console.log(obj.myName);//undefined,         
console.log(obj[myName]);//  
 
var person = {
    name:'gogo'
};
 
//  []            ,        
console.log(person["name"]);//gogo
 
//  .       
console.log(person.name); //gogo

[]中括弧法--属性名として数値を使用できますが、ポイント構文は使用できません.
var obj={};
 
obj[2]=2;   // obj     2      --> obj{2:2}
console.log(obj[2]);//2
 
console.log(obj.2)//Unexpected number
 
console.log(obj) //{2: 2}

[]動的にアクセスできるプロパティ名.プログラムの実行時にプロパティを作成および変更できます.ポイントオペレータは使用できません.(すなわち[]--動的に設定および取得可能)

var customer={};
var addr=['  ','  ','  ','  '];
 
for(i=0;i<4;i++){
    customer["address"+i]=addr[i];
}
 
console.log(addr);  //[ '  ', '  ', '  ', '  ' ]
console.log(customer);  //{ address0: '  ', address1: '  ', address2: '  ', address3: '  ' }
 
var str = "";
    for(i=0;i<4;i++){
    str += customer["address" + i] + "\t";
}
 
console.log(str);   //                    

属性名に構文エラーを引き起こす文字が含まれている場合、または属性名がキーワードまたは予約語である場合は、角カッコ表現を使用することもできます.たとえば:(属性名にスペースがある場合は、カッコ[]を使用します)
var person = {};
person['first name'] ='ling';  //first name      
 
console.log(person['first name']);//ling
//console.log(person.first name)//      
 
person['for'] ='ling_for'; 
person.if ='ling_if';  
 
console.log(person['for']);//ling_for
console.log(person.for);//ling_for
console.log(person['if']);//gogo_if
console.log(person.if);//ling_if