Self-study/Javascript

[JavaScript] 배열(Array)

Munyoung 2023. 8. 26. 09:54

배열 

let color = [
	'blue', 
    'red',
    'yellow'
];
  • index == propertyName
  • 대괄호로 묶어줌
  • index는 0부터 시작 
  • 배열도 객체의 한 종류 typeof 해보면 object가 나옴. 

 

indexing(0~...)

console.log(배열이름[index]);

 

메서드 

let members = ['moon', 'domg', 'seok', 'young', 'BCIT']; 


// 1. length
console.log(members.length);  // 안에 몇개가 있는지 결과값: 5
console.log(members.['length']); 
console.log(members[members.length - 1]); // 배열의 마지막 요소 결과값: BCIT

// 2. 추가 및 수정 
members[5] = 'Nice'; // 없던 자리에는 추가되고
memebers[4] = 'Vancouver';  // 있던 자리는 수정됨. m
members[7] = 'soso'; // undefined로 나오고, 배열의 길이는 8로 바뀜. index 6은 empty가 됨.

1. splice


arr.splice(삭제할index, 삭제할개수, 추가할요소, 추가할요소, ...);

//배열의 첫 요소를 삭제
members.splice(0, 1); 

//배열의 마지막 요소를 삭제
members.splice(members.length - 1, 1); 

//배열의 첫 요소로 값 추가 
members.splice(0, 0, 'Nice'); 

// 배열의 마지막 요소로 값 추가 
members.splice(members.length, 0, 'merong');

2. etc

//배열의 첫 요소를 삭: shift() 
members.shift(); 

//배열의 마지막 요소를 삭제: pop()
members.pop(); 

//배열의 첫 요소로 값 추가: unshift(value)
members.unshift(); 

// 배열의 마지막 요소로 값 추가: push(value)
members.push(value);

3. 배열에서 특정한 값 찾기:  indexOf / lastIndexOf

 

배열에서 특정 값을 찾으려면, indexOf메서드 사용
array.indexOf(item)

=> array에 item이 포함되어 있는지 알 수 있다. 

  • 만약, 포함돼 있다면 item이 있는 인덱스 리턴
  • 포함돼 있지 않다면, -1 리턴
  • 여러번 포함돼 있다면, 처음 발견된 인덱스 리턴 
let brands = ['Google', 'Kakao', 'Naver', 'Kakao'];
console.log(brands.indexOf('Kakao'));
console.log(brands.indexOf('Daum'));

//결과값: 1, -1

lastIndexOf는 반대로 탐색을 뒤에서 부터 함. 

let brands = ['Google', 'Kakao', 'Naver', 'Kakao'];
console.log(brands.lastIndexOf('Kakao'));
console.log(brands.lastIndexOf('Daum'));

// 결과값: 3, -1

4. 배열에서 특정한 값이 있는지 확인: includes

array.includes(item) => 있다면 true 리턴, 없다면 false 리턴 

let brands = ['Google', 'Kakao', 'Naver', 'Kakao'];
console.log(brands.includes('Kakao'));
console.log(brands.includes('Daum'));

// 결과값: true, false

5. 배열뒤집기: reverse

let brands = ['Google', 'Kakao', 'Naver', 'Kakao'];
console.log(brands);
brands.reverse();
console.log(brands);

//결과값:
// (4) ["Google", "Kakao", "Naver", "Kakao"]
// (4) ["Kakao", "Naver", "Kakao", "Google"]

※ 참고링크: https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array

 

Array - JavaScript | MDN

JavaScript Array 클래스는 리스트 형태의 고수준 객체인 배열을 생성할 때 사용하는 전역 객체입니다.

developer.mozilla.org

 

for...of 반복문

문법

for (변수 of 배열) {
	동작부분; 
}

예시 

let fruits = [ 'apple', 'grape', 'orange', 'strawberry', 'blueberry']; 

for(let i = 0; i < fruits.length; i++) {
	console.log(fruits.[i]); 
}

for(let element of fruits) {
	console.log(element); 
}

for(let index in fruits) {
	console.log(fruits[index]); 
} // 배열에서는 for...in 보다는 for...of를 사용하는 것이 안전

 

다차원 배열(multidimensional array)

let twoDimensional = [ [1,2], [3,4]]; 

console.log(twoDimensional[0][1]) // 결과값: 2

 

'Self-study > Javascript' 카테고리의 다른 글

[JavaScript] 문자열심화  (0) 2023.08.30
[JavaScript] 숫자표기법  (2) 2023.08.29
[JavaScript] 객체와 프로퍼티  (0) 2023.08.26
[JavaScript] 제어문  (0) 2023.08.25
[JavaScript] 함수/ Scope/상수  (0) 2023.08.25