[2024.04.18] JS Reference Type

함수

함수 정의

: 실제 사용(호출)에 있어서는 차이 x, 정의할 때의 차이 o

매개변수

• 기본 함수 매개변수 (Default function parameter): 전달하는 인자가 없거나 undefined가 전달된 경우 이름 붙은 매개변수를 기본값으로 초기화
  

• 나머지 매개변수 (Rest parameteres): 임의의 수의 인자를 '배열'로 허용하여 가변 인자를 나타내는 방법
  작성 규칙 >
  함수 정의 시 나머지 매개변수는 하나만 작성할 수 있음
  나머지 매개변수는 함수 정의에서 매개변수 마지막에 위치해야 함
  

• 매개변수와 인자 개수가 불일치 할 때 (파이썬에서는 에러 발생)
  1) if 매개변수 개수 > 인자 개수 => 누락된 인자는 undefined로 할당
  

2) if 매개변수 개수 < 인자 개수 => 초과 입력한 인자는 사용하지 않음

Spread syntax

• 전개 구문: 배열이나 문자열과 같이 반복 가능한 항목을 펼치는 것(확장, 전개). 전개 대상에 따라 역할이 다름(배열이나 객체의 요소를 개별적인 값으로 분리하거나 다른 배열이나 객체의 요소를 현재 배열이나 객체에 추가하는 등)

• 전개 구문 활용처

1. 함수와의 사용
   1-1) 함수 호출 시 인자 확장 (=언패킹)
   
   1-2) 함수 정의 시 나머지 매개변수 (압축)
   

2. 객체와의 사용

3. 배열과의 활용

화살표 함수

• 화살표 함수 작성 과정
  1) function 키워드 제거 후 매개변수와 중괄호 사이에 화살표(=>) 작성
  2) 함수의 매개변수가 하나 뿐이라면, 매개변수의 '()' 제거 가능 (단, 생략하지 않는 것을 권장)
  3) 함수의 본문이 표현식 한 줄이라면, '{}'와 'return' 제거 가능
  

• 참고: 화살표 함수 심화
  

객체

(OOP에서의 객체와 다른 개념, 파이썬에서의 딕셔너리)

구조 및 속성

• 객체 구조
  중괄호('{}')를 이용해 작성
  중괄호 안에는 key: value 쌍으로 구성된 속성을 여러 개 작성 가능
  key는 문자형만 허용
  value는 모든 자료형 허용
  

• 속성 참조
  점('.') 또는 대괄호('[]')로 객체 요소 접근
  key 이름에 띄어쓰기 같은 구분자가 있으면 대괄호 접근만 가능
  
  

• in 연산자: 속성이 객체에 존재하는지 여부를 확인
  

객체와 함수

• Method 사용 예시
  object.method() 방식으로 호출
  메서드는 객체를 '행동'할 수 있게 함
  

this

• this 키워드: 함수나 메서드를 호출한 객체를 가리키는 키워드. 이를 통해 객체에 대한 특정한 작업을 수행할 수 있음. => 함수 내에서 객체의 속성 및 메서드에 접근하기 위해 사용
  

1. 단순 호출 시 this
   가리키는 대상 => 전역 객체
   

2. 메서드 호출 시 this
   가리키는 대상 => 메서드를 호출한 객체
   
   

추가 객체 문법

• 1. 단축 속성
     
• 2. 단축 메서드
     
• 3. 계산된 속성
     
• 4. 구조 분해 할당
     

• 구조 분해 할당 활용
  

• 5. Object with '전개 구문'
     
• 6. 유용한 객체 메서드
     
• 7. Optional chaining ('?.')
     
     
     
     
     

• new 연산자
  
  

배열

: array는 객체에 순서가 붙은 것

• 배열 구조
  대괄호('[]') 이용해 작성
  요소 자료형 : 제약 없음
  length 속성을 사용해 배열에 담긴 요소가 몇 개인지 알 수 있음
  

배열 메서드

Array helper method

• forEach(): 배열의 각 요소를 반복하며 모든 요소에 대해 함수(콜백 함수)를 호출
  
  

• map(): 배열의 모든 요소에 대해 함수(콜백 함수)를 호출하고, 반환된 호출 결과 값을 모아 새로운 배열을 반환
  
  

• 배열 순회 종합
  

• 기타 Array Helper Methods
  

추가 배열 문법

• Array with '전개 구문'
  배열 복사