Day - Mozilla의 avaScript Foundations Professional 인증

콘셉트 하이라이트:

1. for...of 및 for...in 루프
사용
2. Set()과 Array, Map()과 Objects, Set() 및 지도()

1. for...of 및 for...in 루프 사용

루핑은 프로그래밍의 기본 개념으로, 코드 블록을 여러 번 실행할 수 있게 해줍니다. JavaScript에서 for...of 및 for...in은 일반적으로 사용되는 두 가지 루프이지만 서로 다른 용도로 사용됩니다. 차이점을 이해하면 보다 효율적이고 효과적인 코드를 작성하는 데 도움이 됩니다.

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

이 예에서 for...of는 팀 배열의 각 요소(팀)에 직접 액세스하고 이를 콘솔에 기록합니다. 이 루프는 인덱스가 아닌 값만 필요할 때 이상적입니다.

1-2. for...in 루프

반면에 for...in 루프는 객체의 속성(키)을 반복하는 데 사용됩니다. 객체와 함께 사용되는 경우가 많지만 배열과 함께 사용하여 인덱스에 액세스할 수도 있습니다.

예)

let Mariners = {place: 'Seattle', league: 'American', color: 'navy blue'}; 

for (let key in Mariners) {
   console.log(`${key}: ${Mariners[key]}`); 
}

// Output: 
// place: Seattle
// league: American
// color: navy blue

이 예에서 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({}, '빈 객체');

myObject = {

이름: 'John',
42: '대답',
{}: '빈 객체'
};

console.log(myMap.size); // 출력: 3

console.log(Object.keys(myObject).length); // 출력: 2(키 문자열 변환으로 인해)
`
이 예에서 Map()을 사용하면 다양한 키 유형을 사용할 수 있으며 객체 키는 문자열로 변환됩니다. 또한 Map()은 지도의 크기를 쉽게 제공하는 반면, 객체의 경우 수동으로 키를 계산해야 합니다.

2-3. Set() lwn. Map()

• Tujuan:
  • Set() ialah koleksi nilai unik.
  • Map() ialah koleksi pasangan nilai kunci.
• Kes Penggunaan:
  • Gunakan Set() apabila anda perlu menyimpan senarai item unik.
  • Gunakan Map() apabila anda perlu mengaitkan nilai dengan kunci.

cth.)

`
let mySet = new Set([1, 2 ,3]);
let myMap = new Map([['key1', 'value1'], ['key2', 'value2']]);

console.log(mySet.has(2)); // Output: benar
console.log(myMap.get('key1')); // Output: 'nilai'1
`
Dalam contoh ini, Set() digunakan untuk menyemak kewujudan nilai, manakala Map() digunakan untuk mendapatkan semula nilai yang dikaitkan dengan kunci.

위 내용은 Day - Mozilla의 avaScript Foundations Professional 인증의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!