자바스크립트 이터레이터
특징
- iterator로 함수를 생성하고 나면, next 함수 하나를 더 가지고 있다.
done,value를 담은 오브젝트를 반환한다.- done : 이터레이터가 끝이 났는지, 남은게 있는지를 의미
- value : 이터레이터가 돌고 있을 때 값을 반환
- 이전에 얻어온 값 바로 다음 값만 가져올 수 있다.
- 그에 비해 배열은 랜덤액세스가 가능 (index 이용)
배열과 이터레이터를 비교했을 때, 배열이 더 편리하게 사용됨에도 불구하고 이터레이터가 있는 이유
1. 기능이 많다는게 항상 좋다는 건 아니다.
이터레이터는 배열보다 가볍다.
- 이터레이터만 할 수 있는 작업
배열을 이용하면 배열은 모든 아이템을 모두 메모리에 올려놔야 한다.
그만큼의 공간을 사용하지만, 이터레이터는 정의된 변수만 사용된다.
정리
- 제공하는 기능 기준으로 이터레이터는 배열의 부분집합
- 이터레이터를 이용하면 값을 미리 다 계산해서 보관할 필요 없이 다음 값 호출을 받았을 때, 그때 필요한 값만 계산하는게 가능
- map, reduce는 iterator만 있어도 구현 가능
reference
타입스크립트 타입가드 / 네로잉
Type narrowing
- 변수의 타입을 조건에 따라 더 구체적인 것으로 제한하는 과정
- 주로 조건문 내에서 변수의 타입을 좁히는 것이 일반적
(if) - 여러 타입을 가질 수 있는 변수를 특정 타입에서 이루어져야 할 로직을 실행시킬 때 사용
• 예를 들어, string을 ABC로, number를 123으로 세분화하는 것이다.
type guard
- 타입 가드는 타입을 좁히는 기술
• 타입 가드는 typeof 연산자를 사용하여 타입을 좁힐 수 있다.
•typeof variable === 'number'
변수나 값의 타입을 명확하게 지정하고 다룰 때 쓰인다.
1. typeof 타입가드
if(typeof item === "string){
// string 타입
}
else {
return item // string 외 타입
} typeof를 사용하면 아래와 같은 값을 얻을 수 있다.
이렇게 정의 된 타입을 사용하면 범위를 좁힐 수 있다.
"string", "number", "bigint", "boolean", "symbol", "undefined", "object", "function"
2. in 타입가드
object의 타입가드를 사용해야 할 경우 in 타입가
주어진 객체에 주어진 속성이 있으면 true를 반환한다.
interface Warning {
text : string
}
const formatErrorMessage = (value : string | Error | Warning) =>{
// text 속성을 가졌는지 확인 , Warning 타입으로 좁혀짐
if('text' in value) {
}
}3. type predicate를 이용한 타입 가드
• 변수의 타입을 좁히는데 사용되는 특별한 유형의 함수
• 타입 가드 함수는 "{ paramter } is { type }" 형태로 정의되는것이 type predicate다.
- 모든 타입 가드는 이 형태를 따른다.
const formatErrorMessage =
(value : null | undefined | string | Error | Warning) => {...}
// boolean값을 가지지만, string 이라고 단정 지을 수 없음
const isString = (value : any) : boolean =>
typeof value === 'string'위와 같이 인자를 받아서 타입을 반환해줄 때,
첫번째 함수와 같이 boolean을 리턴해주게 된다면,
typescript는 bool 값이 무엇을 의미하는지 알 수 없다.
boolean 값을 리턴하는대신
반환 타입에 "파라미터(이름)은 문자열입니까?" 라는 질문에 대한 답을 반환한다고 해야한다.
// string 지정
const isString = (value : any) : value is string =>
typeof value === 'string'
if(isString(value)) {
return prefix + value
}위와 같이 파라미터에 대한 타입을 확인하도록 작성하여 타입가드를 이용할 수 있다.
reference
- https://byby.dev/ts-type-narrowing
- https://www.youtube.com/watch?v=EoPubc1u5IY&list=PLLbNB9i2QOKMgZN0qkSaXqq1SIRs-mU7X
함수선언식 함수표현식 차이점
함수 선언식
함수 선언식은 함수를 선언하고 해당 함수의 이름을 사용하여 호출할 수 있는 방식입니다.
함수가 선언된 위치에 상관없이 코드 내 어디서든 호출이 가능하며, 호이스팅에 영향을 받습니다.
function add(a, b) {
return a + b;
}
// 함수 호출
const result = add(3, 5);함수 표현식
함수 표현식은 변수에 함수를 할당하는 방식으로 함수를 정의합니다.
변수에 할당된 위치 이전에 함수를 호출하면 에러가 발생합니다. 함수 표현식은 호이스팅에 영향을 받지 않습니다.
const add = function(a, b) {
return a + b;
};
// 함수 호출
const result = add(3, 5);두 방식 모두 함수를 정의하고 호출하는 데 사용되지만, 함수 선언식은 호이스팅에 영향을 받고 함수 표현식은 그렇지 않다는 점에서 차이가 있습니다.
함수 표현식은 주로 변수에 할당되어야 하는 상황이나 익명 함수를 사용해야 할 때 유용합니다.
