[JavaScript] 과제제출법, this, 기타심화

코드스테이츠 sprint과제 제출법

• npm install
• npm run test
• npm run submit
  제출확인
• npx codestates-assignment-manager login

this

• this 사용법

const megalomaniac = {
    mastermind: 'Brain',
    henchman: 'Pinky',
    getFusion: function () {
      return henchman + mastermind; //henchman is not defined
      return this.henchman + this.mastermind //이래야 가져올수있음
    },
    battleCry(numOfBrains) {
      return `They are ${this.henchman} and the` + ` ${this.mastermind}`.repeat(numOfBrains);
    },
};

javascript koans 오답노트

• 이해하고, 외우고있고, 직접 쓸줄알아야 아는거다.
• 함수 표현식 function fow {} 은 호이스팅 안됨.
• 함수 선언식 let fow = function() 은 호이스팅(문자열로 해놨다가 나중에 할당) 됨.
• 가능하면 hoisting 인지하고 코드읽을필요없이 직관적으로 순서대로 적어야함
• 비교연산자 ===, ==
• const는 재할당 금지
• 용어 : 렉시컬환경, this 바인딩, edge case, side effect
• 클로저함수 : 리턴이 함수, 내부함수는 외부함수 변수에 접근가능하다.
• 안에서 전역변수 선언하면 값바뀜
• 매개변수(파라미터)도 스코프에 해당돼있다.
• 함수 파라미터에 할당하지 마시오. 차라리 함수안에서 변수 새로만들고 복사해
• 화살표함수 : (x, y) => { 해도되고 (x,y) => x * y 해도됨
• 화살표로 클로저 표현, 되도록 화살표함수를 써보자

    const subtractor = x => y => {  //변수처럼 함수이름 먼저 써주자
      return x - y
    }

• 원시자료형은 값의 변경이 불가능함.

    let overTwenty = true;
    let allowedToDrink = overTwenty; //allowedToDrink = true

    overTwenty = false; 
    allowedToDrink // true임, 값을 복사한거지 주소값 복사한게 아님

• 참조자료형을 변수에 할당하면, 주소가 할당된다.

[1,2,3] === [1,2,3] // false

• array는 typeof말고 isArray써야함,안그럼 object로 나옴
• 배열안에 함수안에 객체값보기
• Arr3.value1
• 배열 매소드 slice, 다른 주소값을 갖게된다.
• arr.slice() = arr.slice(0)
• arr.slice(2,5) // 2번째인덱스부터 5-1인덱스까지 하겠다
• arr.slice(2,2) // 뒷숫자가 앞보다 작으면 유효하지않음. []나옴
• arr.shift // 맨앞의 값 없앰
• object 의 in은 키만 찾을수 있음
  'name' in job //true
• object 키 없애려면
  delete job.jame
• 클로저함수는 내부함수에서 외부함수 변수 쓸수있지만, 함수를 리턴하는 클로저함수가 아니라면 외부의 변수를 쓰려면 this.birthYear처럼 this를 써야함
• this는 자기자신을 가리킨다.

const megalomaniac = {
      mastermind: 'Brain',
      henchman: 'Pinky',
      getFusion: function () {
        return this.henchman + this.mastermind;
      },

• Object.assign({}, obj); // 객체판 slice(), 왼쪽에 오른쪽 복사함
• spread는 배열이나 객체의 내용물 하나하나를 다룬다.
• [...arr1, ...arr2]로 배열 2개를 붙일 수 있다.
• { ...fullPre, ...me }로 객체 두개를 붙일 수 있다. // 같은키 있으면 me의 값이 씌워진다.
• rest 파라미터는 전달인자를 배열로 다룰 수 있게함
• const returnFirstAfg = Arg => Arg
• returnFirstAfg('first','second','third') 세개와도 'first'만 리턴됨
• let returnFirstAfg = (...Arg) => Arg라면 returnFirstAfg('first','second','third') 넣으면 배열 ['first','second','third'] 리턴됨. 이게 rest 파라미터, 항상 배열임
• rest 파라미터는 매개변수 마지막에 주로쓰고, 배열임.

    function makePizza(dough, name, ...toppings) {
      const order = `You ordered ${name} pizza with ${dough} dough and ${toppings.length} extra toppings!`;
      return order;
    }
    expect(makePizza('napoli', 'meat', 'extra cheese', 'onion', 'bacon')).to.equal(`You ordered meat pizza with napoli dough and 3 extra toppings!`); // 세번째 매개변수부터 ...toppings의 배열로 들어가게됨.

    function getAllParams(required1, required2, ...args) {
      return [required1, required2, args];
    }
    expect(getAllParams(123)).to.deep.equal([123,undefined,[]]); //[1,2,3]아님

• 배열 분배

    const array = ['code', 'states', 'im', 'course']
    const [start, ...rest] = array  // rest? spread?
    expect(start).to.eql('code')
    expect(rest).to.eql(['states','im','course']) //'states','im','course'아님 rest라 배열임

• 객체단축(shorthand)문법

    const name = '김코딩'
    const age = 28

    const person = {
      name,    //this.name 안됨.
      age,
      level: 'Junior',
    }
    expect(person).to.eql({name : '김코딩',age : 28,level:'Junior'}) 

• 객체 분해

    const student = { name: '박해커', major: '물리학과' }

    const { name } = student      
    expect(name).to.eql('박해커')

• rest/spread를 객체분해에 적용할 수 있다.

    const student = { name: '최초보', major: '물리학과' }
    const { name, ...args } = student

    expect(name).to.eql('최초보')
    expect(args).to.eql({major: '물리학과'})//'물리학과'아님

• rest/spread를 객체분해에 적용할 수 있다.

    const student = { name: '최초보', major: '물리학과', lesson: '양자역학', grade: 'B+' }

    function getSummary({ name, lesson: course, grade }) {
      return `${name}님은 ${grade}의 성적으로 ${course}을 수강했습니다`
    }//그냥 키값만 적어두면 키변수가 값이 되고, 키: 값꼴로 적어두면 값부분을 쓰면된다.

    expect(getSummary(student)).to.eql(`최초보님은 B+의 성적으로 양자역학을 수강했습니다`)

10번에 '객체의 단축(shorthand) 문법을 익힙니다'에서 객체 person이 name : this.name으로 못받는건 왤까요?