9. 배열 내장 함수
1. forEach (순회)
let arr = [1, 2, 3, 4, 5];
// 기존 방식.
for (let i = 0; i <= arr.length; i++) {
console.log(i);
}
//짧게 forEach 사용.
arr.forEach(function (l) {
console.log(l);
});
//더 짧게 forEach 사용.
arr.forEach((l) => console.log(l));
2. map (값 새롭게 처리)
let arr = [1, 2, 3, 4, 5];
const newArr = [];
arr.forEach(function (l) {
newArr.push(l * 2);
});
console.log(arr); // [1, 2, 3, 4, 5]
console.log(newArr); // [2, 4, 6, 8, 10]
// 위 행위들을 더 간단하게 map 을 사용 하기.
let arr = [1, 2, 3, 4, 5];
const newArr = arr.map(function (l) {
return l * 2;
});
console.log(newArr); //[2, 4, 6, 8, 10]
3. includes (배열에 포함된지 확인)
let arr = [1, 2, 3, 4, 5];
let number = 2;
let strNumber = "2";
console.log(arr.includes(number)); //true
console.log(arr.includes(number + 5)); //false 7 값은 없으니.
console.log(arr.includes(strNumber)); //false includes 는 === 비교
4. indexOf (배열에 포함되었다면 index 리턴)
없으면 -1 을 리턴한다.
let arr = [1, 2, 3, 4, 5];
let number = 4;
let strNumber = "4";
console.log(arr.indexOf(number)); //3 (0 부터 시작하므로, 4는 arr[3] 이다.)
console.log(arr.indexOf(number + 5)); //-1 7값은 없으니.
console.log(arr.indexOf(strNumber)); //-1 === 비교
5. findIndex (조건에 해당하는 객체내 값의 index를 리턴)
let arr = [
{ name: "배재현" },
{ name: "양준영" },
{ name: "주광현" },
{ name: "신웅재" },
{ name: "신재원" },
{ name: "배재현" } // 중복되는 값을 찾을때 findIndex 는 가장 먼저 만나는 index를 반환한다.
];
console.log(arr.findIndex((l) => l.name === "배재현")); // 0
console.log(arr.findIndex((l) => l.name === "신재원")); // 4
console.log(arr.findIndex((l) => l.name === "박상우")); // -1
6. find ( 조건에 일치하는 element 통으로 가져오기 )
let arr = [
{ name: "배재현" },
{ name: "양준영" },
{ name: "주광현" },
{ name: "신웅재" },
{ name: "신재원" }
];
console.log(arr.find((l) => l.name === "배재현")); // {name: "배재현"}
console.log(arr.find((l) => l.name === "신재원")); // {name: "신재원"}
console.log(arr.find((l) => l.name === "박상우")); // undefined
7. filter (필터링 해서 가져오기)
let arr = [
{ id: 1, name: "배재현" },
{ id: 2, name: "양준영" },
{ id: 3, name: "주광현" },
{ id: 4, name: "신웅재" },
{ id: 5, name: "신재원" },
{ id: 6, name: "배재현" }
];
console.log(arr.filter((l) => l.name === "배재현")); // (2) [Object, Object]
/*
0: Object
id: 1
name: "배재현"
1: Object
id: 6
name: "배재현"
*/
8. slice (배열 자르기)
arr.slice() ⇒ 배열 그대로 반환 (파라미터 안넘기면)
arr.slice(0,2) ⇒ 0 ~ 1번까지 반환 ( 0부터 2미만까지 )
arr.slice(4) ⇒ 4 ~ 끝까지 반환 (4번부터 배열 끝까지 짜름.)
let arr = [
{ id: 1, name: "배재현" },
{ id: 2, name: "양준영" },
{ id: 3, name: "주광현" },
{ id: 4, name: "신웅재" },
{ id: 5, name: "신재원" },
{ id: 6, name: "배재현" }
];
console.log(arr.slice()); // 반응 없음 기존 arr과 동일
console.log(arr.slice(0, 3));
/*
{ id: 1, name: "배재현" },
{ id: 2, name: "양준영" },
{ id: 3, name: "주광현" },
*/
console.log(arr.slice(4));
/*
{ id: 5, name: "신재원" },
{ id: 6, name: "배재현" }
*/
9. concat (배열 붙이기)
let arr = [
{ id: 1, name: "배재현" },
{ id: 2, name: "양준영" },
{ id: 3, name: "주광현" }
];
let arr2 = [
{ id: 4, name: "신웅재" },
{ id: 5, name: "신재원" },
{ id: 6, name: "배재현" }
];
console.log(arr.concat(arr2)); // arr배열에 arr2를 붙인다.
10. sort (배열 정렬하기)
let numbers = [0, 1, 3, 5, 10, 20, 50, 30];
const sortAsc = (a, b) => {
if (a > b) {
return 1;
}
if (a < b) {
return -1;
}
return 0;
};
numbers.sort(sortAsc);
console.log(numbers); //[0, 1, 3, 5, 10, 20, 30, 50]
/*
위와 같은 형식으로 정렬하지 않으면 문자열로 인식할 수 있다.
[0, 1, 10, 20, 3, 5, 50, 30] 이런식으로 나열될 수 있다.
*/
11. join(문자열 합치기)
let names = ["배재현", "양준영", "신웅재", "주광현"];
console.log(names.join()); //배재현,양준영,신웅재,주광현
console.log(names.join("")); //배재현양준영신웅재주광현
console.log(names.join(" ")); // 배재현 양준영 신웅재 주광현
console.log(names.join(" 바보")); // 배재현 바보양준영 바보신웅재 바보주광현
