JavaScript Koans

이성민·2023년 5월 1일
0

JavaScript Koans과제가 주어졌다.
01_Introduction.js
02_Types-part1.js
03_LetConst.js
04_Scope.js
05_ArrowFunction.js
06_Types-part2.js
07_Array.js
08_Object.js
09_SpreadSyntax.js
10_Destructuring.js
10가지 주제와 51개의 koans가 주어졌다.

1, 2, 3, 5, 7, 8, 9, 10번의 경우 막힘없이 풀었고,
4, 6번의 스코프, 클로저, 원시자료형과 참조자료형이 많이 헷갈렸다.

4번

    let age = 27;
    let name = 'jin';
    let height = 179;

    function outerFn() {
      let age = 24;
      name = 'jimin';
      let height = 178;

      function innerFn() {
        age = 26;
        let name = 'suga';
        return height;
      }

      innerFn();

      expect(age).to.equal(26);
      expect(name).to.equal('jimin');

      return innerFn;
    }

    const innerFn = outerFn();

    expect(age).to.equal(27);
    expect(name).to.equal('jimin');
    expect(innerFn()).to.equal(178);
  });
});

innerFn()에서 age의 값은 26으로 변경됐고, name은 outerFn()에서 'jimin'으로 변경됐다.
innerFn()에서 name변수를 새로운값'suga'로 재할당했지만, 이 name은 innerFn()의 지역변수기에 전역스코프의 name과는 다른 변수다.

const innerFn = outerFn();을 했기에 outerFn()에서 age를 24로 초기화하고 innerFn()의 함수에서 age를 26으로 변경하였지만 outerFn에서 선언된 지역변수이기에 전역스코프에선 여전히 age변수값은 27의 값을 가진다.

innerFn()의 값은 return height;의 값인 178이 반환된다.

6번

const nums1 = [1, 2, 3];
const nums2 = [1, 2, 3];

일때 nums1 === nums2의 값은 false가 된다..nums1, nums2의 동일한 데이터를 갖고있지만, heap에는 nums1, nums2 각각에 대한 주소가 담기기 때문에 둘의 주소값이 달라서 false가 나온다.

const person = {
  son: {
    age: 9,
  },
};
const boy = person.son;
boy.age = 20;

일때
expect(person.son.age).to.equal(20);
expect(person.son === boy).to.equal(true);
expect(person.son === { age: 9 }).to.equal(false);
expect(person.son === { age: 20 }).to.equal(false);
가 된다. 여기서도 ???가 나왔다.

밑에 두줄이 false로 나오는 이유는, 위 문제와 같은 논리로 객체 비교 시에는 객체의 내용이 아니라 참조(주소)를 비교하기 때문이다.

둘 다 { age: 20 }이라는 동일한 데이터 값을 가지지만, 실제로는 다른 객체다. person.son은 { age: 20 } 객체의 주소를 가지고 있지만, { age: 20 }와 같은 내용을 가진 다른 객체가 새로 생성되어 그 객체의 주소를 사용하기 때문에 false가 반환된다.

왜 이렇게 힘들게....머리 아프게 이해되지않았다.
문제는 어떻게 풀어도...이걸 적용해서 코드를 적을 수 있을까 걱정이다. 뭐만하면 주소가 다르고...처음이랑 다르게 뭔가 공부를 할수록 확 어려워지는거 같다.

profile
도전자

0개의 댓글

관련 채용 정보