[TDL] 04/21 Today's-Done-List

드디어 JS스터디 신청 완료! 저번에 적었던 글들이 다 사라져서 다시 작성하였다.. 헥헥
됐으면 좋겠다~.~ 되면은 조금 더 열심히 살지 않을까..? 나태한 나에게 열정과 의지를!

---

- JS 기본 문법

• arguments()
  
  • 화살표 함수가 아닌 모든 함수 내에서 사용할 수 있는 지역 변수
  • https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments

function func1(a, b, c) {
  console.log(arguments[0]);
  // expected output: 1

  console.log(arguments[1]);
  // expected output: 2

  console.log(arguments[2]);
  // expected output: 3
}

func1(1, 2, 3);

• arguments는 객체가 아니므로, 객체로 변환해서 사용해주어야 한다.

let args = Array.from(arguments);
// or
let args = [...arguments];

 

• Rest parameters (나머지 매개변수)
  
  • 무한한 수의 인수를 배열로 허용한다.
  • 가변 함수와 같이 사용하면 좋음.
  • https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters

function sum(...theArgs) {
  return theArgs.reduce((previous, current) => {
    return previous + current;
  });
}

console.log(sum(1, 2, 3));
// expected output: 6

console.log(sum(1, 2, 3, 4));
// expected output: 10

 

---

- JavaScript baseball

어제 baseball의 고려해야 할 상수, 변수명들을 정리하는 것을 빼먹어서 지금 적어보자!

const get = (target) => document.querySelector(target)

const baseball = {
    limit: 10,                          // 열번의 시도
    trial: 0,                           // 입력시 올라갈 시도 (10까지)
    digit: 4,                           // 입력받을 네자리의 숫자
    end: false,                         // 게임 끝
    $question: get('.ball_question'),
    $answer: get('.ball_answer'),
    $input: get('.ball_input'),
}

// 구조분해할당
const { limit, digit, $question, $answer, $input } = baseball
let { trial, end } = baseball

• 구조 분해 할당
  https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment

 

• 임의의 4개의 숫자를 선정하는 로직
  
  • 1. gameLimit에 배열 안에 10개의 false 요소를 생성
    2. 반복 문안에 10 이하의 랜덤 숫자를 생성.
    3. password 변수 안에 랜덤 숫자를 추가하고,
    4. password에 중복되는 수를 넣지 않기 위해서 gameLimit 배열 안의 index를 true로 변경해준다.
    5. password의 길이가 4개, 즉 4개의 숫자가 나올 때까지 반복문을 돌려서 password의 값을 구한다.
  • password가 2987일 때 gameLimit 배열의 모습.
    2번째, 9번째, 8번째, 7번째가 순서대로 true로 변하는 것을 볼 수 있음.

const setPwd = () => {
    const gameLimit = Array(limit).fill(false)
    let password = ''
    while (digit > password.length) {
      const random = Math.floor(Math.random() * 10)

      if (gameLimit[random]) {
        continue
      }

      password += random
      gameLimit[random] = true
    }
    baseball.password = password
  }

 

• 분명 이런 식으로 함수 안에 또 다른 함수를 하나의 argument로 넣을 수 있단 것을 알았고, 많이 봐왔을 텐데
  오늘따라 되게 새롭고, 메모해두고 싶어서 적었다.

// const 상수명 = 함수1(param1, 함수2(params1, params2))

const result = onPlayed(inputnumber, getResult(inputnumber, password))

 

• Set함수를 이용해서 입력받을 중복 숫자 걸러내기.
  원래의 코드에서는 join함수 대신 split을 사용했는데, 둘의 차이는 무엇일까?
  • join() : Array.prototype.join()
    배열의 모든 요소를 연결해 하나의 문자열로 만든다.
    https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/join
  • split() : String.prototype.split()
    string 객체를 지정한 구분자를 이용해서 여러 개의 문자열로 나눈다.
    https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String/split

const isDuplicate = (number) => {
    return [...new Set(number)].join('').length !== digit
    //또는 return [...new Set(number.split(''))].length !== digit
  }

 

---

17:50 오후 회고 스터디 (만족도 : 6)

어제보다는 집중이 잘 됐지만, 그래도 아직 많이 부족하다ㅠ

---

- 드라마앤컴퍼니 박명호 개발자님의 라이브 세션

• 코딩은 무조건 많이 해봐야 된다!
• 면접관이 코드를 볼 땐
  • ES6 문법에 의거하여 알맞게 작성하였나
  • 비동기 문법을 이해하고 적재적소에 활용하였나
  • 일관된 코드 스타일로 작성하였나

---

- 자료구조 / 알고리즘 (Js ver.) 강의

• 조합 (combination)
  • 서로 다른 n개의 원소 중에서 r를 중복 없이 골라 순서에 상관없이 나열하는 경우의 수 (nCr)
  • 4개의 숫자 카드에서 2개를 뽑는 경우의 수 
• 점화식 (= 재귀식)
  • 점화식(재귀식)이란 수열에서 이웃하는 두 개의 항 사이에 성립하는 관계를 나타낸 관계식
  • 대표적인 점화식

    1. 등차수열 : F(n) = F(n - 1) + a

    2. 등비수열 : F(n) = F(n - 1) * a

    3. 팩토리얼  : F(n) = F(n - 1) * n

    4. 피보나치수열 : F(n) = F(n - 1) + F(n - 2)
    

    

---

22:50 저녁 회고 스터디 (만족도 : 6)

재귀 함수 너무 어려워.... 알고리즘 너무 어려워....
그래도 조금씩 재귀가 이해되긴 하는데 코드로 구현은 저얼대 못해~ 지금도 거의 뒷목 잡고 끌려다니는 수준인데ㅠ.ㅠ
30문제정도 풀면 눈감고도 할 수 있으려나?

---

[ 출처, 참고 : 제로베이스 프런트엔드 스쿨 ]