배열 - 문자, 숫자, 객체, 함수 등 포함 가능
let arr = [
'민수', // 문자
3, // 정수
false, // 논리연산자
{
name: 'Mike',
age: 30,
}, // 객체
function() { // 함수
console.log('TEST');
}
]
console.log(arr[4]);
console.log(arr[3].name);
let days = ['월','화','수'];
호출
console.log(days[index]);
길이
console.log(days.length);
추가
배열뒤에
days.push('목');
console.log(days);
배열앞에
days.unshift('일');
console.log(days);
제거
배열뒤에
days.pop();
console.log(days);
배열앞에
days.shift();
console.log(days);
for ... of - for 문보단 간결하지만 index를 얻을수 없음
for(let day of days) {
console.log(day);
}
배열도 객체이기 때문에 for ... in 은 사용가능 하나 단점이 많아서 권장하지 않음.
splice(n, m, x) - n부터 m까지 특정 요소 지우고 x 값을 차례로 추가
let arr = ["나는", "철수", "입니다"];
arr.splice(1, 0, "대한민국", "소방관");
// ["나는", "대한민국", "소방관", "철수", "입니다"]
arr.splice(1, 2);
// ["나는"]
slice() - n부터 m까지 반환
let arr = [1,2,3,4,5];
arr.slice(1,4); // [2,3,4]
let arr2 = arr.slice(); // 배열복제
concat() - 합쳐서 새배열 반환
let arr = [1,2];
arr.concat([3,4]); // [1,2,3,4]
indexOf() / lastIndexOf()
let arr = [1,2,3,4,5,1,2,3];
arr.indexOf(3); // 2
arr.indexOf(3,3); // 7
arr.lastIndexOf(3); // 7
includes() - 포함하는지
let arr = [1,2,3];
arr.includes(2); // true
arr.includes(8); // false
arr.find(fn) / arr.findIndex(fn)
// find(fn) 해당하는 첫 번째 값을 반환하고 없으면 undefind 를 반환
// findIndexOf(fn) 해당하는 첫 번째 값의 인덱스를 반환하고 없으면 undefind 를 반환
// ex 1)
let arr = [1,2,3,4,5];
const result = arr.find((item)=>{
return item % 2 === 0; // 짝수인것
});
console.log(result); // 첫번째 착수인 2를 찾고 반환한다.
// ex 2)
let userList = [
{ name: "Mike", age: 30 },
{ name: "Jane", age: 27 },
{ name: "Tom", age: 10 },
];
const result2 userList.find(()=>{
if (user.age < 19) { // userList 중 age 19 미만인것
return true;
}
return false;
});
console.log(result2); // { name: "Tom", age: 10 } 이 해당함으로 true 반환
arr.filter(fn) - find와 findIndexOf 사용법과 같음, 만족하는 모든 요소를 배열로 반환
const arr = [1,2,3,4,5];
const result = arr.filter((item)=>{
return item % 2 === 0;
});
console.log(result); // 짝수인 모든 값을 반환 [2, 4]
arr.reverse() - 역순으로 재정렬
const arr = [1,2,3,4,5];
arr.reverse(); // [5,4,3,2,1] 반환
arr.map(fn) - 함수를 받아 특정 기능을 시행하고 새로운 배열을 반환
const userList = [
{ name: "Mike", age: 30 },
{ name: "Jane", age: 27 },
{ name: "Tom", age: 10 },
];
let newUserList = userList.map((user, index)=>{
return Object.assign({}, user, {
id: index + 1,
idAdult: user.age > 19,
});
});
console.log(newUserList);
console.log(userList); // 기존 값은 변경된게 없음.
join("합칠 문자") / split("나눌 문자")
// join()
let arr = ["안녕","나는","철수야"];
let result = arr.join();
let result2 = arr.join("-");
console.log(result); // join() 내부에 아무것도 입력하지 않았을시 기본 (,) 으로 합쳐짐 결과, "안녕,나는,철수야"
console.log(result2); // join("-") 내부에 입력한 (-) 으로 합쳐짐 결과, "안녕-나는-철수야"
// split()
const users = "Mike,Jane,Tom,Tony";
const result3 = users.split(",");
console.log(result3); // 문자열 users를 , 기준으로 잘라 배열로 만듬 결과, ["Mike","Jane","Tom","Tony"]
Array.isArray(객체 또는 배열) - 배열이면 true 배열이 아니면 false 반환
arr.sort() - 배열 재정렬, 배열 자체가 변경되니 주의가 필요
// 함수 이용X
let arr = [1,5,4,2,3];
arr.sort();
console.log(arr); // 결과 [1,2,3,4,5]
let arr2 = [27,8,5,13];
arr2.sort();
console.log(arr2); // 결과 [13,27,5,8] 13앞에 1과 27 앞에 2의 기순으로 정렬이 되기 때문에 이상하게 정렬됨
// 함수 이용
arr2.sort((a, b)=>{
return a - b;
});
console.log(arr2); // 결과 [5,8,13,27]
reduce
// ex 1)
let arr = [1,5,4,2,3];
// 배열의 모든수 합치기
// 인수를 함수로 받음
// (누적 계산값, 현재값) => { return 계산값 };
const result = arr.reduce((prev, current)=>{
return prev + current;
}, 0);
console.log(result); // 결과 15
// ex2 )
let userList = [
{ name: "Mike", age: 30 },
{ name: "Tom", age: 10 },
{ name: "Jane", age: 27 },
{ name: "Sue", age: 26 },
{ name: "Harry", age: 42 },
{ name: "Steve", age: 60 },
];
let result = userList.reduce((prev, current)=>{
if(current.age > 19) {
prev.push(current.name);
}
return prev;
}, []);
console.log(result);
'Dev > JAVASCRIPT' 카테고리의 다른 글
Javascript JS 객체 메소드(Object methods), 계산된 프로퍼티(Computed property) (0) | 2024.01.29 |
---|---|
Javascript JS 생성자 함수(new) (0) | 2024.01.29 |
Javascript JS 객체(Object) method (0) | 2024.01.29 |
Javascript JS 객체(Object) (0) | 2024.01.29 |
Javascript JS 형변환 (0) | 2024.01.29 |