JavaScriptでドット表記とブラケット表記を使用する場合について学びます。

Javascript Jeep🚙💨

Follow

Nov 27, 2019 – 3 min read

Dot vs Bracket notation in JavaScript

We can access the property of an object by

  • Dot notation
  • Bracket notation

This is most popular and most used way of accessing an object.The Braquet notation in JavaScript. これにより、コードがより読みやすくなります。 ドット記法は最も頻繁に使用されます。

Syntax: obj.property_name

var user = {name : "Mark"};user.name ; // "Mark"

When not to use dot notation

Consider that we have a property name as 123

var obj = {
'123' : 123
};

In the above case if we cannot access using

obj.123; 

So, if the property name is not the valid identifier , then we cannot access its value using . notation.In the above cases in which is not been been the property name.

識別子とは

識別子は、variablefunctionproperty を識別するコード内の一連の文字です。 一般的には、関数や変数の名前、オブジェクトのプロパティ名

有効な識別子とは?

var obj = {
'123' : 123
};obj; // 123

Note

JavaScript では $ , _ は有効な識別子なので、.記法を用いてこれらのプロパティにアクセスすることができる。

var obj = {
$ : 10,
_ : 20
}obj.$; // 10obj._; // 20

ブラケット表記

ブラケット表記は、プロパティ名が無効な識別子(数字で始まる、記号を含む)である場合に使用します。

var obj = {
test-123 : "test"
}// in this case we cannot use dot notationobj; // "test"

プロパティ名がnumberであれば、オブジェクト生成時にプロパティ名をsingle /double quotesで囲む必要はありません。 しかし、ブラケット表記では、プロパティ名がwhole numberであれば、single /double quotesの中で名前をラップする必要はない。

例1: 整数

var obj = {
123456 : 10
}obj;

例2: Double

var obj = {
123.456 : 10
}obj; // undefinedobj; // 10

例3: 不正な数値

var obj = {
123.123.123 : 10 // throws invalid number error
}For this case use single/double quotesvar obj = {
'123.123.123' : 10
}

例4: 特殊記号

var obj = {
'123-test' : "test"
}obj; // error(test is not defined)obj; // "test"

変数をプロパティ名として使用

例1 :

var test = "test";var obj = {
test : "Test success"
}obj // "Test success"

例2 :

var obj = {
name : "Mark"
age : 20
}var name = "age";obj; // Mark
obj; // 20

例3: プロパティ名として使用

var obj = {
'123-test' : "test"
}obj; // error(test is not defined)obj; // "test"

例1:

var obj = {
name : "Mark"
age : 20
}var name = "age";obj; // Mark
obj; // 20

例2:

var test = "test";var obj = {
test : "Test success"
}obj // "Test success"

例3:

var obj = {
'123-test' : "test"
}obj; // error(test is not defined)obj; // "test"

例4:プロパティとして使用

例4: 特殊記号を使用 ブラケット表記を使った実例

プロパティ名にobjectを使うこともできますが、その場合は

var a = {};var b = {};var c = {};c = 10;c ; {: 10}c = 20; // this will replace old c; {: 20}

プロパティ名として empty stringを持つこともできます

var obj= {};var emptyString = "";obj = "10";obj; // 10

コメントを残す

メールアドレスが公開されることはありません。