(TIL) 2024-11-05

JavaScript

---

함수

Arrya.form(객체) : 객체를 배열로 변환

데이터타입의 종류 및 메모리

데이터 타입

• 기본형 : String, Number, Boolean
• 참조형 : Object

방식

• 기본형 : 값이 담긴 주소값을 복제
• 참조형 : 값이 담긴 주소값들로 이루어진 묶음을 가르키는 주소값을 복제

불변성의 여부

• 기본형 : 불변성을 뜀
• 참조형 : 불변성을 띄지 않음

메모리,데이터
a.비트
- 0,1로 구성된 작은 조각
b.바이트
- 비트를 8개로
c.메모리
- 바이트(byte) 단위로 구성 - 모든 데이터는 byte 단위의 식별자인 메모리 주소값을 통해서 서로 구분

64비트 저장: 64비트를 8바이트로 분할해서 메모레에서 8개의 연속된 바이트에 저장

식별자,변수

• 변수 = 데이터
• 식별자 = 변수명

변수 선언과 데이터 할당(기본형데이터)
var str; //선언
str = ‘test’ //할당

• 변수명에 대한 주소값 안에 데이터의 주소값을 갖음
• 자유로운 데이터 변환
• 메모리의 효율적 관리

불변 객체(얉은 복사 싶은 복사)

• 얕은 복사 : 바로 아래 단계의 값만 복사하는 방법
  단점: 중첩된 객체(객체 안에 객체)에 대해서 <ul>완벽한 복사를 할 수 없다.</ul>
  for ~ in 구문을 이용하여, 객체의 모든 프로퍼티에 접근할 수 있다.

  var result = {};
  for (var prop in target) {
    result[prop] = target[prop]
  }
  

• 깊은 복사 : 내부의 모든 값들을 하나하나 다 찾아서 모두 복사하는 방법
  재귀적 수행

  var copyObjectDeep = function(target) {
    var result = {};
    if (typeof target === 'object' && target !== null) {
        for (var prop in target) {
            result[prop] = copyObjectDeep(target[prop]);
        }
    } else {
        result = target;
    }
    return result;
  }
  

undefined 와 null

• Undefined
  1. 변수에 값이 지정되지 않은 경우 (메모리 주소)
  2. .이나 []로 접근하려 할 때, 해당 데이터가 존재하지 않는 경우
  3. return 문이 없거나 호출되지 않는 함수의 실행 결과
  '없다'를 명시적으로 표현할 때는 undefined를 사용하지 말자
• Null
  1. ‘없다’를 명시적으로 표현

실행 컨텍스트 및 콜스택

실행컨텍스트(스코프,변수,객체,호이스팅)
실행할 코드에 제공할 환경 정보를 모아놓은 객체

1. 선언된 변수를 위로 끌어올림 = (호이스팅)
2. 외부 환경 정보를 구성
3. this 값을 설정

JS에서는 다른 언어랑은 다른 특징

콜 스택 실행 컨텍스트가 생성되는 시점이 콜 스택의 맨 위에 쌓이는 순간.

1. VariableEnviroment (VE)
   1. Record : 식별자 정보 (var a)
      호이스팅 : record의 수집과정/ 변수들을 수집하는 과정 / 위로 끌어올림
      함수 선언문, 함수 표현식
      • 함수 정의 3가지 방식

       // 함수 선언문. 함수명 a가 곧 변수명
       // function 정의부만 존재, 할당 명령이 없는 경우
       function a () { /* ... */ }
       a(); // 실행 ok
      
       // 함수 표현식. 정의한 function을 별도 변수에 할당하는 경우
       // (1) 익명함수표현식 : 변수명 b가 곧 변수명(일반적 case에요)
       var b = function () { /* ... */ }
       b(); // 실행 ok
      
       // (2) 기명 함수 표현식 : 변수명은 c, 함수명은 d
       // d()는 c() 안에서 재귀적으로 호출될 때만 사용 가능하므로 사용성에 대한 의문
       var c = function d () { /* ... */ } 
       c(); // 실행 ok
       d(); // 에러!
      

      결론 함수 표현식을 사용 하는 습관을 들여라

   2. Outer : 외부 환경 정보
      • 스코프 체인 : 식별자의 유효범위를 안에서부터 바깥으로 차례로 검색해나가는 것.
        각각의 실행 컨텍스트는 LE 안에 record와 outer를 가지고 있고, outer 안에는 그 실행 컨텍스트가 선언될 당시의 LE정보가 다 들어있으니 scope chain에 의해 상위 컨텍스트의 record를 읽어올 수 있다.
   3. 생길 때 간직(Snapshot)
      • 스냅샷 유지
2. LexicalEnviroment (LE)
   1. 변경사항을 실시간으로 반영
3. ThisBinding
   1. 전역
      • 노드 : Global
      • 윈도우 : Window
   2. 메서드 내부
      1. 함수 vs 메서드 : 함수는 그 자체로 독립적인 기능을 수행해요. CASE1 : 함수 // 호출 주체를 명시할 수 없기 때문에 this는 전역 객체를 의미해요. CASE2 : 메서드 // 호출 주체를 명시할 수 있기 때문에 this는 해당 객체(obj)를 의미해요.

      화살표 함수(=this를 바인딩하지 않는 함수