[본 캠프 9일차] JavaScript 문법 종합반 강의 2주차 마무리

Map, Set의 목적 : 기존의 객체, 배열보다 데이터의 구성, 검색, 사용을 효율적으로 처리한다.

 

Map 소개 및 예시코드 연습

- key / value 이 둘을 저장하는 객체와 비슷하다. 객체도 key value pair 을 저장.

- 객체는 key 에 문자 형태로 저장했었지만, map 은 key에 어떤 유형의 데이터타입이 다 들어간다.

- map 은 키가 정렬된 순서로 저장되기 때문이다.

- 기능 : 검색, 삭제, 제거, 여부 확인

- 대량 데이터를 처리하려고 사용한다.

 

const myMap = new Map(); 
myMap.set('key', 'value');

 

myMap.get('key')

// set 과 get 은 pair 다.

 

- 반복적인 부분이 중요 > 반복을 위한 메소드 : keys(), values(), entries()

- map 에서 가장 중요한 부분 > 반복을 얘기할 때는 iterator(반복자) 개념을 이해해야 한다.

- iterator 는 for ~ ( of ) 로 사용.  keys 의 iterator , values 의 iterator 반복문을 사용한다.

- map : key, value pair 저장 / set ( " key ", " value " ) >  "keys" , "values"

const myMap = new Map();
myMap.set("one", 1);
myMap.set("two", 2;
myMap.set("three", 3);

console.log(myMap.keys()); // { 'one', 'two', 'three' }
console.log(myMap.values()); // { 1, 2, 3 }

for (const key of myMap.keys()) {
  console.log(key);  // one two three
}
// key가 하나하나씩 순회를 돌면서 출력을 해준다.

 

 

- 필요한 로직을 그때그때 넣어서 맵 하나하나 돌아갈때마다 필터링이나 데이터값을 입력해서 처리할 수 있다.

 

console.log(myMap.entries()); // { [ 'one', 1 ], [ 'two', 2 ], [ 'three', 3 ] }

// key 와 value 를 하나의 배열로 묶어서 전체 내역을 iterator 로 감싸줬다. 

 

console.log(myMap.size) // map의 사이즈(길이) > 3

console.log(myMap.has("two")); // key 검색 > true 

 

for (const key of myMap.keys()) {
for (const value of myMap.values()) {

for (const entry of myMap.entries()) {

 

Set 소개 및 예시코드 연습

- 고유한 값을 저장하는 자료구조.

- 값만 저장하고. 키를 저장하지는 않는다.

- 값이 중복되지 않는 유일한 요소로만 구성된다.

- 값 추가, 검색, 값 삭제, 모든 값 제거, 존재 여부 확인

 

const mySet = new Set();

mySet.add("value1");

mySet.add("value2");

mySet.add("value2");

 

console.log(mySet.size); // 2 > 값이 중복되지 않은 유일한 요소로만 구성되기 때문에 value2가 중복되므로 2개로 인식

console.log(mySet.has("value1"); // true

console.log(mySet.has("value2"); // ture

console.log(mySet.has("value3"); // false > value3 가 없기 때문이다

 

for(const value of mySet.values() {

     console.log(value);

}

// map 에서는 선택지가 key, value, entry 가 있었지만, set은 선택지가 value 밖에 없다. 키를 저장하지 않기 때문이다

---

걷기반 2주차 복습 강의

1. 1부터 10까지의 숫자를 순서대로 콘솔에 출력하는 함수 printNumbers를 작성하세요.

function printNumbers() {  
// 여기에 for 문을 작성하세요
     for(let i = 1; i <= 10; i++) {
        console.log(i);
     }
}; 
// 함수 호출
printNumbers(); // 출력: 1, 2, 3, 4, 5, 6, 7, 8, 9, 10

// 1부터, i는 10보다 작거나 같으니까 10까지 차례대로 순회하며, console.log(i) 출력해라

 

2. 1부터 n까지의 숫자의 합을 계산하여 콘솔에 출력하는 함수 sumUpTo를 작성하세요.

function sumUpTo(n) {
    let sum = 0;
    // 여기에 for 문을 작성하세요
    for (let i = 1; i <= n; i++) { 
        sum = sum + i; 
    }
    console.log(sum);
}

// 예시 출력
sumUpTo(5); // 출력: 15 (1+2+3+4+5)
sumUpTo(10); // 출력: 55 (1+2+3+4+5+6+7+8+9+10)

// n이 5니까, 1부터 n까지(5까지), i++(한번씩 순회하며 더해라). 그리고 sum 은 0 + i; 니까 1씩 다 더하면 15
// n이 10, 1부터 10까지, 한번씩 다 순회하며 더해라. 그리고 sum은 1부터 순회하며 다 더하면 55

 

3. 주어진 배열에서 짝수 숫자만 콘솔에 출력하는 함수 printEvenNumbers를 작성하세요.

function printEvenNumbers(arr) {
  // 여기에 for 문과 if 문을 작성하세요
  for (let i = 0; i <arr.length; i++) {
    if (arr[i] % 2 === 0) {
        console.log(arr[i]);
    }
  }
};
// 예시 출력
printEvenNumbers([1, 2, 3, 4, 5, 6]); // 출력: 2, 4, 6
printEvenNumbers([10, 15, 20, 25, 30]); // 출력: 10, 20, 30

// i 가 arr의 length(길이) 보다 작을 때, i를 순회해라. 만약 arr[i] 요소중 2를 나눴을 때 0이 나오면. arr[i]를 출력해라.

 

4. 주어진 배열의 숫자들을 거꾸로 콘솔에 출력하는 함수 printReversed를 작성하세요.

function printReversed(arr) {
// 여기에 for 문을 작성하세요
    for(let i = arr.length; i > 0; i--) {
        console.log(arr[i - 1]); 
    }
}

// 예시 출력
printReversed([1, 2, 3, 4, 5]); // 출력: 5, 4, 3, 2, 1
printReversed([10, 20, 30, 40]); // 출력: 40, 30, 20, 10

// i 가 arr의 길이(5)와 같다, i가 0보다 클 때까지, i-- 빼라 (i = 5, i는 0보다 크니까 0이 되기전까지 빼라)
// arr 의 i 요소에서 -1을 해라. ( 배열은 순서를 0부터 시작하니까 i = 5면, 5번째 5는 6이므로 -1을 해라.)

 

5. 주어진 사람 객체에서 이름만 반환하는 함수 getName을 작성하고, 반환된 이름을 콘솔에 출력하세요.

function getName(person) {
    // 여기에 이름을 반환하는 코드를 작성하세요
      console.log(person.name);
      return person.name;
  }
 
  // 예시 출력
  const name1 = getName({ name: 'Alice', age: 25 });
  console.log(name1); // 출력: Alice
 
  const name2 = getName({ name: 'Bob', age: 30 });
  console.log(name2); // 출력: Bob

// console.log(person.name) 은 getName(person) 이니까, return person.name 하면 된다.

---

배열 연습하기 2주차 숙제

문자열로 구성된 리스트 strings와, 정수 n이 주어졌을 때, 각 문자열의 인덱스 n번째 글자를 기준으로 오름차순 정렬하려 합니다. 예를 들어 strings가 ["sun", "bed", "car"]이고 n이 1이면 각 단어의 인덱스 1의 문자 "u", "e", "a"로 strings를 정렬합니다.

 

strings	n	return
["sun", "bed", "car"]	1	["car", "bed", "sun"]
[abce", "abcd", "cdx"]	2	["abcd", "abce", "cdx"]

 

function solution(strings, n) {
    var answer = [];

// 문자열 가장앞 글자 붙인 문자 배열 만들기
    for (var = 0; i < strings.length; i++) {  // i 가 strings의 길이보다 작을 때, 더한다
      strings[i] = strings[i][n] + strings[i];   
// strings의 i번째 요소는 strings의 i번째 요소에 있는 n번째(1)에 strings의 i번째 요소를 더한것과 같다.
    }      // 'usun', 'ebed', 'acar'


// 문자열 사전순 정렬
    strings.sort();  // sort() 메소드를 사용하여 ' acar', 'ebed', 'usun' 을 오름차순으로 바꿔준다. 

// 앞글자 제거 후 리턴
    for(var j = 0; j < strings.length; j ++) {   // 위에 i 를 써서 j 로 써준다.
      strings[j] = strings[j].replace(strings[j][0],""); 
// string[j] 는 strings[j] 번째 요소를 replace(문자열 대체)를 한다. 어떻게? strings j요소의 0번째를 (" ") 제거한다.
      answer.push(strings[j]); // answer 에 push() 메소드를 사용해서 strings[j] 넣는다.
    }
    return answer;
}