コンセプトハイライト:

1. ループで for...of および for...in
を使用する
2. Set() と Array、Map() と Objects、および Set() の違い] と Map()

1. for...of ループと for...in ループの使用

ループはプログラミングの基本的な概念であり、コードのブロックを複数回実行できるようになります。 JavaScript では、for...of と for...in の 2 つのループがよく使用されますが、それらは異なる目的を果たします。違いを理解すると、より効率的で効果的なコードを作成するのに役立ちます。

1.1 for...of ループ

for...of ループは、配列、文​​字列、マップ、セットなどの反復可能なオブジェクトを反復するために使用されます。これにより、インデックスを気にすることなく、シーケンス内の各値に簡単にアクセスできます。

例えば。）

let teams = ['Red Sox', 'Dodgers', 'Padres']; 

for (let team of teams) {
   console.log(team);
}

// Output: 
// Read Sox
// Dodgers
// Padres

let チーム = ['レッドソックス'、'ドジャース'、'パドレス']; for (チームをチームにしましょう) { コンソール.ログ(チーム); } // 出力: // ソックスを読み取る // ドジャース // パドレス

この例では、for...of は、teams 配列内の各要素 (チーム) に直接アクセスし、それをコンソールに記録します。このループは、インデックスではなく値のみが必要な場合に最適です。

1-2. for...in ループ

一方、

for...in ループは、オブジェクトのプロパティ (キー) を反復処理するために使用されます。これはオブジェクトでよく使用されますが、インデックスにアクセスするために配列でも使用できます。

例えば。）

let teams = ['Red Sox', 'Dodgers', 'Padres']; 

for (let team of teams) {
   console.log(team);
}

// Output: 
// Read Sox
// Dodgers
// Padres

let Mariners = {場所: 'シアトル'、リーグ: 'アメリカン'、色: 'ネイビーブルー'}; for (キーをマリナーズに入れます) { console.log(`${key}: ${Mariners[key]}`); } // 出力: // 場所: シアトル // リーグ: アメリカ // 色: ネイビーブルー

この例では、for...in は Mariners オブジェクトのキーを反復処理し、キーと対応する値の両方にアクセスできるようにします。 for...in は数値インデックスだけでなく、列挙可能なすべてのプロパティを反復処理するため、配列では慎重に使用する必要があることに注意することが重要です。

1-3.主な違い

• 目的：
  for...of: 反復可能なオブジェクト (配列、文字列、セット、マップ) の値を反復処理します。
  for...in: オブジェクトの列挙可能なプロパティ (キー) を反復処理します。
• 使用事例：
  値に直接アクセスする必要がある場合は、for...of を使用します。
  キーまたはプロパティ名にアクセスする必要がある場合は、for...in を使用します。

2. Set() と配列、Map() とオブジェクト、Set() と `Map() の違い

JavaScript はさまざまなデータ構造を提供しますが、それぞれに長所と短所があります。最も一般的に使用されるいくつかの

の違いを調べました。

2-1. Set() と配列の比較

• 独自性:
  Set() は一意の値を保存します。つまり、重複は許可されません。
  配列では重複した値が許可されます。
• 注文：
  Set() は挿入順序を繰り返します。
  配列でも挿入順序は維持されますが、重複によって操作方法が変わる可能性があります。

例)

`

let mySet = new Set([1, 2, 3, 3, 4]);

myArray = [1, 2, 3, 3, 4]; とします。

console.log(mySet) // 出力: Set { 1, 2, 3, 4 }

console.log(myArray) // 出力: [1, 2, 3, 3, 4]

`

この例では、Set() は重複 3

を自動的に削除しますが、配列はそれを保持します。 Set() は、一意の項目のコレクションが必要な場合に便利です。

2-2. Map() とオブジェクトの比較

• キーの種類:
  Map(): キーは、オブジェクト、関数、プリミティブ型など、任意の型にすることができます。
  • オブジェクト
  : キーは通常、文字列または記号です。

• 注文：
  • Map()
  は挿入順序を維持します。
  • オブジェクト
  はキーの順序を保証しません。

• サイズ：
  • Map() には、キーと値のペアの数を示す size
  プロパティがあります。
  • オブジェクト
  は、キーを反復処理してサイズを手動で決定する必要があります。

例えば。）

`
let myMap = new Map();
myMap.set('名前', 'ジョン');
myMap.set(42, '答え');

myMap.set({}, '空のオブジェクト');

let myObject = {
名前: 'ジョン',
42: 「答え」、
{}: '空のオブジェクト'

};

console.log(myMap.size); // 出力: 3
console.log(Object.keys(myObject).length); // 出力: 2 (キー文字列変換のため)
`

この例では、Map() によりさまざまなキー タイプの使用が許可され、オブジェクト キーは文字列に変換されます。さらに、Map() はマップのサイズを簡単に提供しますが、オブジェクトの場合は手動でキーを数える必要があります。

2-3. Set() と Map() の比較

• 目的：
  • Set()
  は一意の値のコレクションです。
  • Map()
  は、キーと値のペアのコレクションです。
• 使用事例：
  一意の項目のリストを保存する必要がある場合は、Set() を使用します。
  値をキーに関連付ける必要がある場合は、Map() を使用します。

例えば。）

`
let mySet = new Set([1, 2 ,3]);

let myMap = new Map([['key1', 'value1'], ['key2', 'value2']]);

console.log(mySet.has(2)); // 出力: true
console.log(myMap.get('key1')); // 出力: '値'1
`

この例では、Set() を使用して値の存在を確認し、Map() を使用してキーに関連付けられた値を取得します。