Programming/JavaScript

[JavaScript ]Object Array 메소드 push / pop / shift / unshift

psychoria 2023. 3. 18. 05:32
반응형

배열은 실무에서도 정말 많이 사용하는 데이터 구조이며 익숙해 지는 것이 중요합니다. 그 중에서도 집중해서 연습해봐야 하는 것은 object를 담고 있는 array 입니다.

const emojis = [
{name: '호랑이',  emoji:'🐅'},
{name: '토끼', emoji:'🐇'},
{name: '용', emoji:'🐉'},
{name: '고양이', emoji:'🐈'}
];

1. push() - 배열 끝에 하나 이상의 요소를 추가하고 배열의 길이를 반환합니다.

emojis.push({name: '소', emoji:'🐄'});
console.log(emojis);
/* 결과
{name: '호랑이',  emoji:'🐅'},
{name: '토끼', emoji:'🐇'},
{name: '용', emoji:'🐉'},
{name: '고양이', emoji:'🐈'}
{name: '소', emoji:'🐄'}
*/

2. pop() - 배열에서 마지막 요소를 제거하고 해당요소를 반환합니다.

emojis.pop();
console.log(emojis);
/* 결과
{name: '호랑이',  emoji:'🐅'},
{name: '토끼', emoji:'🐇'},
{name: '용', emoji:'🐉'},
{name: '고양이', emoji:'🐈'}
*/

3. shift() - 배열에서 번째 요소를 제거하고 해당 요소를 반환합니다.

emojis.shift();
console.log(emojis);  
/* 결과
{name: '토끼', emoji:'🐇'},
{name: '용', emoji:'🐉'},
{name: '고양이', emoji:'🐈'}
*/

4.unshift() - 배열의 시작 부분에 하나 이상의 요소를 추가하고 배열의 길이를 반환합니다.

emojis.push({name: '소', emoji:'🐄'});
console.log(emojis);

/*결과
{name: '소', emoji:'🐄'},
{name: '토끼', emoji:'🐇'},
{name: '용', emoji:'🐉'},
{name: '고양이', emoji:'🐈'}
*/
반응형