study keyword

1.배열이 필요한 이유와 선언하는 방법

when we want to store list of elements and access them by a single variable.
storing a collection of multiple items under a single variable name
하나의 배열내에 여러 자료형의 데이터를 담을 수 있다.
하나의 변수에 여러 데이터를 관리할 수 있기 때문에, 코드의 가독성이 높아지고, 변수의 수를 줄여주고, 연산에 편리하다.
관련성 있는 데이터를 함께 변수에 저장하므로 데이터를 찾는데 용이하다.

배열의 선언

[대괄호]를 사용한 리터럴 방식
let myArray = [12,25,'christmas'];
리터럴 방식으로 배열값들을 변수 선언과 동시에 함꼐 선언하여 사용하는 방법
let myArray = newArray[12,25,'christmas'];

2.배열의 값을 추가, 수정, 삭제하는 방법

요소를 수정하기
[2,3,5,12,25,'크리스마스']라는 배열에서 2번째 값을 '생일'이라고 수정해보자

let myArray = [2,3,5,12,25,'크리스마스'];
myAraay[2] = '생일'; // 2번째 값을 '생일'로 할당
console.log(myArray); // [2,3,'생일',12,25,'크리스마스']

요소를 추가하기 ->> push

let myArray = [12,25,'크리스마스'];
myAraay.push('기념일')
console.log(myArray); // [12,25,'크리스마스','기념일']

요소를 삭제하기 ->> pop, shift

shift =>> 배열의 첫번째 요소부터 삭제해주는 기능
let myArray = [12,25,'크리스마스'];
myArray.shift() // 맨첫번째 요소를 삭제해라
console.log(myArray); // [25,'크리스마스']
pop =>> 배열의 맨끝 요소부터 삭제해주는 기능
let myArray = [12,25,'크리스마스'];
myArray.pop() // 맨끝 요소를 삭제해라
console.log(myArray); // [12,25]

3.반복문이 필요한 이유와 사용하는 방법

It makes the code compact.
반복문은 같은 계산을 여러번 하는 것을 한 번의 코딩으로 해결할 수 있게끔 해준다.
또한 코딩을 하는 사람이 여러번 반복되는 작업을 일일이 하나씩 작업을 하게된다면 실수가 일어날 수도 있기 때문에 한 번의 반복문 사용으로 실수를 없앨 수도 있다.
반복문의 구조
반복문은 4가지 구역으로 나눌 수 있는데

for ([initialization]; [condition]; [final-expression]){
statement};

initialization: 변수 선언, 주로 카운터 변수를 초기화할때 사용한다. var이나 let키워드를 사용해서 새로운 변수를 선언할 수도 있다. 주로 i, j, k를 쓰는 이유는 수학에서 자주쓰는 변수라 그런듯하다.
condition: 매 반복마다 평가할 식. 평가 결과가 true이면 statement 실행 false면 반복하는 것을 중단한다.
final-expression: 매번 반복 후 평가할 식 다음번 condition 평가 이전에 발생. 주로 카운터 변수를 증감하거나 바꿀때 사용한다.
statement: condition이 true이면 실행하는 문, 여러 문을 반복 실행하려면 블럭문({...})으로 묶어야한다.

4.배열과 반복문을 함께 자주 사용하는 이유

반복문은 자료의 개수가 많고 같은 작업을 반복할 때 필요합니다.여러개의 값이 저장되어있는 배열과 반복문을 함께 사용하면 배열의 각 요소들을 순회하며 원하는 값을 도출할 수 있습니다.
배열에 있는 각각의 요소들마다 따로 코드를 입력하지 않아도 되기 때문에 코드의 가독성이 좋아지고 수정도 간편해집니다.
Loops offer a quick and easy way to do something repeatedly.
반복문은 동일한 명령을 정해진 횟수만큼 반복하여 수행하도록 제어하는 명령문으로 구문(syntax)에는 주로 변수 증감을 위한 명령을 많이 사용하는데, 배열의 index가 해당 역할을 수행하기에 적합하기 때문에 배열과 반복문은 자주 함께 쓰인다.

5.배열의 메서드 5가지와 사용 방법

1)slice()

slice ( start , end )
필요에 따라 인자는 최소 1개만 쓸 수도 있습니다.

첫번째 인자 : 배열의 index의 시작점
두번째 인자 : 배열의 index의 끝점

let nums = [1,2,3,4,5]
let nums_new = nums.slice(1,4)
console.log(nums) // [ 1, 2, 3, 4, 5 ]
console.log(nums_new) // [ 2, 3, 4 ]

slice 메서드를 사용한 이후에 원본 배열인 nums를 콘솔창에서 확인해보면 변함없는 것을 확인할 수 있습니다.

그렇기 때문에 slice를 사용할 때는 꼭 새로운 변수명을 할당해주어야 합니다.

let nums = [1,2,3,4,5]
let nums_new = nums.slice(-2)
console.log(nums) // [ 1, 2, 3, 4, 5 ]
console.log(nums_new) // [ 4, 5 ]
let nums = [1,2,3,4,5]
let nums_new = nums.slice(1)
console.log(nums_new) // [ 2,3,4,5]

2)splice()

splice 메서드는 배열 내의 특정한 요소를 삭제하거나, 다른 요소로 대치하거나 새로운 요소를 추가할 때 사용합니다.
splice ( start, delete, item )
.splice('인덱스 위치','삭제 할 요소의 개수','추가 할 요소','추가 할 요소2','추가할 요소3',... '추가할 요소 n')
필요에 따라 인자는 최소 1개만 쓸 수도 있습니다.

첫번째 인자 : 배열의 index의 시작점
두번째 인자 : 삭제할 요소의 개수
세번째 인자 이후 : 추가하고 싶은 요소

let num = [1,2,3,4,5];
num.splice(2,1,10);
console.log(num); // [ 1, 2, 10, 4, 5 ]
let num = [3,4,5];
num.splice(0,0,1,2);
console.log(num); // [1,2,3,4,5] 삭제할 개수를 0으로 지정하면 추가만 할 수 있습니다.

3)filter()

.filter
filter() 메서드는 array 관련 메서드로 조건에 맞는 요소들만 모아서 새로운 배열을 반환합니다.
만약 조건에 부합되는 요소가 아무것도 없다면 빈 배열을 반환합니다.
filter() 메서드도 map() 메서드와 마찬가지로 크게 filter(callbackFunction, thisAgr) 2개의 인자를 가집니다.
그리고 callbackFunction 안에서 3개의 인자 (element, index, array) 를 가지는데 첫번째 부분인 element 인자만 필수로 지정되어야하고 나머지는 선택적입니다.

let numbers = [10, 4, 32, 17, 5, 2];
// 첫번째 방법 (filter()의 인자에서 바로 함수를 써주는 방법)
let result = numbers.filter((value)=> value > 10);
console.log(result); // [ 32, 17 ]
// 두번째 방법 (밖에서 함수를 선언하고 filter()인자에서 callback하는 방법) function isBiggerThanTen (value) {
return value > 10;
}
let result = numbers.filter(isBiggerThanTen);
console.log(result); // [ 32, 17 ]

4)concat()

concat() 메서드는 주어진 배열에 기존 배열을 합쳐서 새로운 배열을 반환합니다.
원본 배열은 변하지 않으며 새로운 배열이나 원본 배열을 수정해도 서로 영향을 받지 않습니다.

let alphabet = ['a', 'b', 'c'];
let hangeul = ['ㄱ', 'ㄴ', 'ㄷ'];
alphabet.concat(hangeul); // [ 'a', 'b', 'c', 'ㄱ', 'ㄴ', 'ㄷ' ]
const alpha = ['a', 'b', 'c'];
// 배열 2개 이어붙이기
const arr = [1, [2, 3]];
alpha.concat(arr); // [ 'a', 'b', 'c', 1, [ 2, 3 ] ]
// 배열 3개 이어붙이기
alpha.concat(1, [2, 3]); // [ 'a', 'b', 'c', 1, 2, 3 ]

5)indexOf()

배열 안 요소의 인덱스를 찾아줍니다.

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