125 lines
		
	
	
		
			3.8 KiB
		
	
	
	
		
			Markdown
		
	
	
	
	
	
		
		
			
		
	
	
			125 lines
		
	
	
		
			3.8 KiB
		
	
	
	
		
			Markdown
		
	
	
	
	
	
| 
								 | 
							
								---
							 | 
						||
| 
								 | 
							
								id: 587d7b7c367417b2b2512b18
							 | 
						||
| 
								 | 
							
								title: JavaScript オブジェクトにキーと値のペアを追加する
							 | 
						||
| 
								 | 
							
								challengeType: 1
							 | 
						||
| 
								 | 
							
								forumTopicId: 301153
							 | 
						||
| 
								 | 
							
								dashedName: add-key-value-pairs-to-javascript-objects
							 | 
						||
| 
								 | 
							
								---
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								# --description--
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								最も基本的なオブジェクトは、<dfn>キーと値</dfn>のペアのみの集合です。 言い換えれば、これは<dfn>プロパティ</dfn> ( <dfn>キー</dfn>) と呼ばれる一意の識別子にマッピングされるデータ (<dfn>値</dfn>) の集まりです。 例を見てみましょう。
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```js
							 | 
						||
| 
								 | 
							
								const tekkenCharacter = {
							 | 
						||
| 
								 | 
							
								  player: 'Hwoarang',
							 | 
						||
| 
								 | 
							
								  fightingStyle: 'Tae Kwon Doe',
							 | 
						||
| 
								 | 
							
								  human: true
							 | 
						||
| 
								 | 
							
								};
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								上記のコードは、`tekkenCharacter` という鉄拳ビデオゲームキャラクターのオブジェクトを定義しています。 オブジェクトには 3 つのプロパティがあり、それぞれが特定の値にマッピングされています。 "origin" などの新しいプロパティを追加したい場合は、`origin` をオブジェクトに割り当てます。
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```js
							 | 
						||
| 
								 | 
							
								tekkenCharacter.origin = 'South Korea';
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								これにはドット記法を使用しています。 `tekkenCharacter` オブジェクトを確認すると、`origin` プロパティが追加されたことがわかります。 Hwoarang は特徴的なオレンジ色の髪をしていました。 このプロパティをブラケット記法で追加することができます。
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```js
							 | 
						||
| 
								 | 
							
								tekkenCharacter['hair color'] = 'dyed orange';
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								プロパティにスペースがある場合や、プロパティに名前を付けるために変数を使用する場合には、ブラケット記法が必要となります。 上記の場合、プロパティを引用符で囲んで文字列として示すことで、表示されているとおりに追加されます。 引用符がなければ、変数として評価され、プロパティの名前は変数の値となります。 次に変数を含む例を示します。
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```js
							 | 
						||
| 
								 | 
							
								const eyes = 'eye color';
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								tekkenCharacter[eyes] = 'brown';
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								すべての例を追加すると、このオブジェクトは次のようになります。
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```js
							 | 
						||
| 
								 | 
							
								{
							 | 
						||
| 
								 | 
							
								  player: 'Hwoarang',
							 | 
						||
| 
								 | 
							
								  fightingStyle: 'Tae Kwon Doe',
							 | 
						||
| 
								 | 
							
								  human: true,
							 | 
						||
| 
								 | 
							
								  origin: 'South Korea',
							 | 
						||
| 
								 | 
							
								  'hair color': 'dyed orange',
							 | 
						||
| 
								 | 
							
								  'eye color': 'brown'
							 | 
						||
| 
								 | 
							
								};
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								# --instructions--
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								3 つのエントリを持つ `foods` オブジェクトが作成されています。 任意の構文を用いて、このオブジェクトに新たに 3 つのエントリを追加してください。`bananas` の値は `13`、`grapes` の値は `35`、`strawberries` の値は `27` です。
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								# --hints--
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								`foods` はオブジェクトである必要があります。
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```js
							 | 
						||
| 
								 | 
							
								assert(typeof foods === 'object');
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								`foods` オブジェクトには値 `13` を持つキー `bananas` が含まれている必要があります。
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```js
							 | 
						||
| 
								 | 
							
								assert(foods.bananas === 13);
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								`foods` オブジェクトには値 `35` を持つキー `grapes` が含まれている必要があります。
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```js
							 | 
						||
| 
								 | 
							
								assert(foods.grapes === 35);
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								`foods` オブジェクトには値 `27` を持つキー `strawberries` が含まれている必要があります。
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```js
							 | 
						||
| 
								 | 
							
								assert(foods.strawberries === 27);
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								キーと値のペアはドット記法またはブラケット記法を使用して、設定する必要があります。
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```js
							 | 
						||
| 
								 | 
							
								assert(
							 | 
						||
| 
								 | 
							
								  code.search(/bananas:/) === -1 &&
							 | 
						||
| 
								 | 
							
								    code.search(/grapes:/) === -1 &&
							 | 
						||
| 
								 | 
							
								    code.search(/strawberries:/) === -1
							 | 
						||
| 
								 | 
							
								);
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								# --seed--
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								## --seed-contents--
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```js
							 | 
						||
| 
								 | 
							
								let foods = {
							 | 
						||
| 
								 | 
							
								  apples: 25,
							 | 
						||
| 
								 | 
							
								  oranges: 32,
							 | 
						||
| 
								 | 
							
								  plums: 28
							 | 
						||
| 
								 | 
							
								};
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								// Only change code below this line
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								// Only change code above this line
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								console.log(foods);
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								# --solutions--
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```js
							 | 
						||
| 
								 | 
							
								let foods = {
							 | 
						||
| 
								 | 
							
								  apples: 25,
							 | 
						||
| 
								 | 
							
								  oranges: 32,
							 | 
						||
| 
								 | 
							
								  plums: 28
							 | 
						||
| 
								 | 
							
								};
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								foods['bananas'] = 13;
							 | 
						||
| 
								 | 
							
								foods['grapes']  = 35;
							 | 
						||
| 
								 | 
							
								foods['strawberries'] = 27;
							 | 
						||
| 
								 | 
							
								```
							 |