배열과 객체 (1)

이번에 포스팅 할 내용은 배열과 객체입니다 !

배열이란?

자바스크립트의 배열이란 관련 있는 데이터를 하나의 변수에 할당하여 관리하기 위해 사용되는 데이터 타입이다.

배열을 만들기 위해선 배열을 선언 하거나 new Array() 를 사용 하지만 주로 []라는 배열을 선언해주고 값을 할당해주는 것을 많이 사용합니다 둘의 성능에는 차이는 없습니다 .

배열 안에는 어떤 것 들이 들어 갈 수 있을까요 ?

배열 안에는 모든 타입(함수 , 배열, 숫자, 문자열 , 객체 등)이 들어갈 수 있습니다

let a = [1,2,3,"hello", null, true, []]; 

배열에는 어떻게 값을 저장 할 수 있을까요?

let ab = [1]; //이렇게 값을 저장할 수 있고, 
ab.push(4); //push 메서드로 배열에 값을 순차적으로 추가할 수 있다. 
ab[1000] = 2; //특정 index 위치에 값을 추가할 수 있다. 

또한 ab.length 처럼 length의 속성으로 배열의 길이(개수)를 알아 낼 수 있습니다

배열에서 사용 할 수 있는 메서드는 어떤 것들이 있을까요 ?

우선 많은 메서드들이 있겠지만 제가 사용해보고 실제로 자주 사용하기도 하는 메서드를 소개해 드리려고 합니다.

pop() : 배열의 뒷부분을 삭제 해주는 메서드

let arr = [ 1, 2, 3, 4 ];
arr.pop();
console.log( arr ); // [ 1, 2, 3 ]

push: 배열의 뒷부분에 값을 추가해 주는 메서드

let arr = [ 1, 2, 3, 4 ];
arr.push( 5 );
console.log( arr ); // [ 1, 2, 3, 4, 5 ]

shift : 배열의 앞부분의 값을 삭제하는 메서드

let arr = [ 1, 2, 3, 4 ];
arr.shift();
console.log( arr ); // [ 2, 3, 4 ]

unshift : 배열의 앞부분에 값을 추가해주는 메서드

let arr = [ 1, 2, 3, 4 ];
arr.unshift( 0 );
console.log( arr ); // [ 0, 1, 2, 3, 4 ]

splice :배열의 특정위치에 요소를 추가하거나 삭제
splice( index, 제거할 요소 개수, 배열에 추가될 요소 )

let arr = [ 1, 2, 3, 4, 5, 6, 7 ];
arr.splice( 3, 2 );
console.log( arr ); // [ 1, 2, 3, 6, 7 ]   3번째 인덱스에서부터 2개 제거

let arr = [ 1, 2, 3, 4, 5, 6, 7 ];
arr.splice( 2, 1, "a", "b");
console.log( arr ); // [ 1, 2, "a", "b", 4, 5, 6, 7 ] 2번째 인덱스에서 1개 제거 후 "a"와 "b"를 추가

slice : 배열의 startIndex부터 endIndex까지(endIndex는 불포함)에 대한 shallow copy 를해서 새로운 배열 객체로 반환

let arr = [ 1, 2, 3, 4, 5, 6, 7 ];
let newArr = arr.slice( 3, 6 );
console.log( 'slice',  newArr ); // [ 4, 5, 6 ]

concat :_ 다수의 배열을 합친다

let arr1 = [ 1, 2, 3 ];
let arr2 = [ 4, 5, 6 ];
let arr3 = arr2.concat( arr1 );
console.log( arr3 ); // [ 4, 5, 6, 1, 2, 3 ]

join: 배열의 원소 전부를 하나의 배열로 합친다

var arr =[ 1, 2, 3, 4 ];
console.log( arr.join() );      // 1,2,3,4
console.log( arr.join( '-' ) ); // 1-2-3-4

every : 배열의 모든 요소가 제공한 함수로 구현된 테스트를 통과하는지를 테스트

var arr =[ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ];
var isEven = function( value ) {

  // value가 2의 배수이면 true를 반환한다.
  return value % 2 === 0;
};

출처 http://blog.302chanwoo.com/2017/08/javascript-array-method/