241108 TIL - map() 복습, join(), Math.trunc, indexOf(), iterable, array-like

map() 콜백함수의 매개변수

/* map()의 기본 구조 */
arr.map(function(currentValue[, index[, array]]) {
    // 변환(mapping)할 로직: 변환된 결과를 반환해야 합니다.
}[, thisArg]);

• currentValue : (필수) 처리할 현재 요소, arr에서 순회할 요소들이 할당됨
• index : (선택) 처리할 현재 요소의 인덱스
• array : (선택) map을 호출한 배열. 원본 배열에 접근이 필요할 때 활용
• thisArg : (선택) 콜백함수에서 this로 사용할 객체를 지정

 

Array.join()

배열의 각 요소를 지정된 구분자로 연결해 하나의 문자열로 반환

/* join() 기본 구조 */
arr.join(separator)

• separator : (선택) 배열 요소 사이에 들어갈 구분자로 문자열로 지정함. 생략시 쉼표 ","로 지정됨. 구분자 없이 모든 요소 붙이고 싶다면 빈문자열 "" 입력!

/* 활용 */
const nums = [1, 2, 3, 4, 5];

let joinNums = nums.join(); // 반환 : "1,2,3,4,5"
let joinNums = nums.join(""); // 반환 : "12345"
let joinNums = nums.join("/"); // 반환 : "1/2/3/4/5"

Math.trunc

숫자의 소수점 이하를 제거하고 정수 부분만 반환

/* Math.trunc() 기본 구조 */
Math.trunc(num)

• num : 정수만 반환할 숫자

반올림하는 round, 버리는 floor, 올리는 ceil과 달리 그냥 깔끔하게 제거해버림. 의도에 맞게 활용할 것!

특히 floor와 유사하지만, 입력한 숫자가 음수일 때 반환값이 차이남

/* floor와 trunc의 차이 예시 */
let num = -3.14;

Math.floor(num); // 반환 : -4
Math.trunc(num); // 반환 : -3, 깔끔하게 날림

 

 

Array.indexof()

검색할 배열에서 매개변수로 입력된 값과 첫 번째로 같은 값의 인덱스를 반환. 찾을 수 없다면 -1 반환

배열 뿐 아니라 문자열에도 활용 가능! of할 때 O가 대문자다!!

/* indexOf() 기본 구조 */
arr.indexOf(searchElement[, fromIndex])

• searchElement : (필수) 배열에서 찾을 요소
• fromIndex : (선택) 검색을 시작할 인덱스. 생략시 맨 처음인 0부터 시작. 음수 사용시 배열 맨 끝부터 역순으로 검색. 이 값이 arr.length보다 크거나 같으면 indexOf()가 -1을 반환

 

 

slice()를 활용한 배열 복사

slice는 배열 또는 문자열의 원하는 부분만 추출해서 새 배열 또는 문자열을 반환

이때 인자에 아무것도 넣지 않으면 통째로 새 배열로 반환하는데, 이를 복사처럼 활용할 수 있다!

 

 

iterable vs array-like

• 이터러블 객체 : Symbol.iterator 메서드가 구현된 객체고, next()가 반드시 구현돼있어야함
• 유사배열 객체 : 인덱스와 length 속성이 있는 객체

둘다 해당하는 경우의 객체가 있을 수 있지만 기본적으로 다른 개념

이터러블이든 유사배열이든 배열이 아닌지라 배열 메서드가 안 먹는데, 불편하면 Array.from()이나 전개구문 ㄱㄱ

 

 

기억할 것들 

• for in문은 index를 순회하고, for of문은 요소를 직접 순회한다는 차이가 있음!
• switch문은 일치비교일 때만! 범위비교에서 활용은 적절하지 않음
• 백틱안에 ${} 넣듯이, 객체 key에 변수 참조하려면 [key] 이렇게 해줘야함!