forEach()
forEach() 함수는 반복문을 통해 배열의 요소를 접근하지 않고도 콜백 함수로 간편하게 배열 요소들을 처리할 수 있는 함수이다. 각 요소의 값뿐만 아니라 인덱스와 배열 자체도 콜백 함수에서 사용할 수 있다.
예제 1
const arr = [1, 2, 3];
arr.forEach(console.log);forEach는 콜백 함수에 세 개의 인자를 전달한다.
- 배열 요소 (value)
- 현재 인덱스 (index)
- 배열 자체 (array)
따라서 위 코드의 실행 결과는 1 2 3이 한 줄씩 출력되는 것이 아니라, 아래와 같은 출력이 나타난다.
1 0 [ 1, 2, 3 ]
2 1 [ 1, 2, 3 ]
3 2 [ 1, 2, 3 ]value만 출력하고 싶다면, 명시적으로 첫 번째 인자만 받도록 해야 한다.
arr.forEach((value) => console.log(value));
parseInt()
parseInt() 함수는 문자열 인자를 파싱해 특정 진수의 정수를 반환한다. 첫 번째 요소로 value를, 두 번째 요소로 radix를 전달한다.
예제 2
const numbers = [273, 52, 103]
const test = numbers.map(parseInt)
console.log(test)위 코드는 내부적으로 아래와 같이 실행된다.
parseInt(273, 0)
parseInt(52, 1)
parseInt(103, 2)(1) parseInt(273, 0)
- radix가 0이면 10진수로 해석된다.
(2) parseInt(52, 1)
- radix가 1이면 유효하지 않은 진수이므로 NaN을 반환한다.
(3) parseInt(103, 2)
- parseInt는 숫자 해석을 가능한 부분까지만 하고, 이후 잘못된 문자가 나오면 무시한다.
- 따라서 parseInt(103, 2)는 103을 2진수로 해석하려고 시도하지만, 103의 세 번째 숫자인 '3'이 2진수에서 유효하지 않기 때문에 103에서 유효한 부분인 10을 해석하면 10진수로 2가 된다.
따라서 위 코드의 실행 결과는 아래와 같다.
[ 273, NaN, 2 ]10진수로 받고 싶다면 parseInt를 직접 전달하는 대신, 명확한 콜백 함수를 제공해야 한다.
const test = numbers.map(num => parseInt(num, 10))
console.log(test)parseFloat()
parseFloat() 함수는 radix 개념이 없으며, 무조건 10진수 부동소수점 값으로 변환한다.
예제 3
const values = ["10.5", "20.8", "30px"];
const result = values.map(parseFloat);
console.log(result);- parseFloat()은 문자열에서 숫자로 해석할 수 있는 부분을 앞에서부터 읽고, 숫자가 아닌 문자가 나오면 해석을 멈춘다.
- 유효한 숫자로 시작하지 않으면 NaN을 반환한다.
따라서 위 코드의 실행 결과는 아래와 같다.
[ 10.5, 20.8, 30 ]예제 4
console.log(parseFloat("50.7kg"));
console.log(parseFloat("3.14abc"));
console.log(parseFloat("px100"));
console.log(parseFloat("0.5e2"));
50.7
3.14
NaN // 숫자로 시작하지 않음
50 // 지수 표기법 해석 가능참고
728x90
반응형