Web/JavaScript
JavaScript | 배열 선언 / 추가,삭제/ 검색
일렁이는코드
2021. 9. 3. 16:48
1. 배열의 선언과 요소
2. 배열에 있는 요소 출력하기
3. 배열의 요소 추가 / 삭제
4. 배열의 검색
배열의 선언과 요소
//배열의 선언
const arr1 = new Array();
const arr2 = [1,2];
//배열의 요소
const myArr = ['apple','banana'];
console.log(myArr[1]); // 'banana' | 1번 인덱스에 접근하여 값 출력
console.log(myArr.length); // 2 | myArr의 배열 요소의 개수
myArr[1] = 'Orange' // 요소 수정하기
배열에 있는 요소 전체 출력하기
myArr=['apple','banana','carrot'];
// 1 for
for( let i=0; i< myArr.length; i++){
console.log(myArr[i]);
}
//2 for of
for(let fruit of myArr){
console.log(myArr);
}
//3 forEach
myArr.forEach((fruit) => console.log(fruit));
배열의 요소 추가 / 삭제
myArr=['apple','banana','carrot'];
// 1 push
myArr.push('lemon','abocado');
console.log(myArr); // ['apple','banana','carrot','lemon','abocado']
//2.pop
myArr.pop();
console.log(myArr); // ['apple','banana','carrot','lemon']
//3. unshift
myArr.unshift('tomato');
console.log(myArr); // ['tomato','apple','banana','carrot','lemon']
//4. shift
myArr.shift('tomato');
console.log(myArr); // ['apple','banana','carrot','lemon']
//5. splice
myArr.splice(1,2);
console.log(myArr); // ['apple','lemon']
myArr.splice(1,1,'watermelon','grape');
console.log(myArr); // ['apple','watermelon','grape','lemon']
//6. concat
const myArr2 = ['coconut','pear'];
const newArr = myArr.concat(myArr2);
console.log(newArr); // ['apple','watermelon','grape','lemon','coconut','pear']
- pop / push / unshift / shift
- pop / push : 배열 맨 끝에 요소 추가 / 삭제
- unshift / shift : 배열 맨 앞에 요소 추가 / 삭제
* unshift와 shift는 맨 앞 요소를 건드리기 때문에 pop, push 보다 처리속도가 느림. - splice
splice는 (기준점이 될 인덱스 번호, 지우고자 하는 인덱스 개수) 로 보통 쓰이며 뒤에 추가하고자 하는 요소를 더 선언할 수 있다.
.splice(2) 로 선언하게 되면 2번째 인덱스까지만 요소를 남기고 나머지를 모두 삭제시킨다. - concat
두개의 배열의 요소를 합쳐주는 기능
배열의 검색
myArr=['apple','banana','carrot'];
// 1 indexOf
console.log(myArr.indexOf('banana')); // 1
// 2 lastIndexOf
myArr.push('apple');
console.log(myArr); // ['apple','banana','carrot','apple'];
console.log(myArr.indexOf('apple')); // 0
console.log(myArr.indexOf('pear')); // -1
console.log(myArr.lastIndexOf('apple')); // 3
// 3 includes
console.log(myArr.includes('banana')); // true
console.log(myArr.includes('melon')); // false
- indexOf / lastIndexOf
- indexOf : 검색하고자 하는 요소의 맨 첫 번째 인덱스를 출력
- lastIndexOf : 검색하고자 하는 요소의 맨 마지막 인덱스를 출력 - includes
검색하고자 하는 요소가 있는지 없는지를 Boolean으로 출력
반응형