배열 기초
배열은 순서가 있고 순서는 인덱스라고 부른다
let myNumber = [73, 98, 86, 61, 96]; myNumber[3];; // 61 // "myNumber라는 배열의 3번째 인덱스"의 값을 변경하려면 myNumber[3] = 200; // myNumber라는 배열의 길이를 알아내려면 myNumber.length; // 4
온점(dot)을 이용해서 변수가 가지고 있는 속성(property)에 접근할 수 있다
배열로 할 수 있는 것들: 요소(element)를 추가할 수 있다
// myNumber라는 배열 끝에 96이라는 값을 추가하려면 myNumber.push(96);온점(dot)을 이용해서 관련된 명령(method라고 부릅니다)도 실행할 수 있다.
명령을 실행할 때는, 함수를 실행하듯 괄호를 열고 닫는 형태로 실행합니다.// myNumber라는 배열 마지막 값을 삭제하려면 myNumber.pop();
배열의 반복
반복문을 이용해 배열의 요소(element)를 한번씩 출력하려면?
let myNum = [73, 98, 86, 61]; for(let n = 0; n < myNum.length; n++) { console.log(myNum[n]);
값은 요소 값 할당안하면 undefined 없는 인덱스는 undefined로 나온다 push() ㅡ 명령(method) typeof [ 1,2,3 ] > object
ㅡ Array.isArray
자바스크립트의 특정 값이 배열인지 아닌지 판별할 수 있는
검사하고 싶은 객체 의 결과 true, false
Array.isArray('문자열') > false Array.isArray(123) > false Array.isArray( [1, 2, 3]), Array.isArray([ ]) > true
ㅡ 배열의 요소(element)를 push, pop를 활용하여 추가 및 삭제
- arr.shift () 앞에 있는거 뺀다. - arr.unshift ( ) 앞쪽에 추가한다. 뒤에 element 추가 : push 뒤에 element 삭제 : pop 앞의 element 추가 : unshift 앞의 element 삭제 : shift
ㅡ indexOf, includes
(1) indexOf
자바스크립트의 특정 값이 배열에 포함되어 있는지 확인할 수 있다.
indexOf 없는 값 넣으면 -1로 출력됨.
특정 값 있으면 그 인덱스 값 나옴. 대소문자 구분 잘하기참, 거짓으로 예문 예시
ex) words.indexOf( ' 없는 것 ' ) !== -1 >>> 없는 값일 때 출력은 -1 이므로(2) includes
있는지 없는 지 확인하기 위한 내장된 메소드 >>> true, false 출력includes는 존재 여부만 알 수 있지만 indesOf 는 번호까지 알 수 있다.
ㅡ 기타
method는 어떤 짓 해주고 싶을때 .... 배열 같은거 push나 이런거
객체의 구성요소에서 변수의 기능을 하면 property
객체의 구성요소에서 함수의 기능을 하면 methodarr.push() >> method 배열이라는거에 내장되있는 함수 arr.length >> property배열이 빈 배열인지 확인? let arr1 = []; console.log(arr1.length === 0) >>> true console.log(arr1 === [ ]); >>>>이런 식으로는 XXXXX. unit10 참조자료형 배울 때 이유 배운다
배열 내장 메서드
배열에 사용할 수 있는 자동으로 생성되어있는 함수.
원본 배열 직접 변경과 변경하지 않음 여부에 따라 달라진다.
ex) let a = b.slice() 이런식으로 새로운 변수로 선언을 해준 뒤 변수 a를 수정해도
slice는 immutable method기 때문에 원본 배열을 변경하지 않는다.- Mutable Method
원본 배열을 직접 변경함
pop(), splice(), push(), shift(), unshift()- Immutable Method
원본 배열을 변경하지 않음
slice(), concat()
- push
- arr.push(9); >>> 끝에 9 들어간다.
return arr.push(9) 로하면 안되는 이유
ㅡ> arr.unshift, 든 arr.push 든 변경된 배열의 길이를 리턴하고 있다.
- splice
중간에 있는거 제거
arr.splice(7) >> 7번째 요소부터 다 업애달라는 말. arr.splice(1, 7) >> 1번 인덱스부터 7개 없애겠다. arr.splice(1, 7, '1', '2')1번 부터 7번까지 제거하고 그자리에 1과 2를 넣는다
- slice
slice() > 잘래내서 복붙
slice(0, 4) > 0번째 인덱스부터 4번째 인덱스 앞까지.
슬라이스는 원본이 변하지 않기 때문에 새로운 변수에 할당해서 사용한다.
- concat( )
문자열 합치기
- indexOf
없는 값이면 -1을 리턴
- includes( )
true, false;
for of
모든 요소 순회할 때는 for of 문을 사용하면 더 간결하고 편리
반복문 안에서 index를 활용하고 싶을 때는 약간 애매.
let el of xx ㅡ> xx의 모든 요소 반복
el >> a[i] 느낌
@@@@기타
.join()
arr.slice(0, 3).join(""); //[0, 1, 0] // '010' Array.join() join() 메서드는 배열의 모든 요소를 연결해 하나의 문자열로 만든다.const arr = ['바람', '비', '물']; console.log(arr.join()); // 바람,비,물 console.log(arr.join('')); // 바람비물 console.log(arr.join('-')); // 바람-비-물
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ
function addToFront(arr, element) { arr.unshift(element); return arr; }unshift메서드는 원본 배열을 변화시킨다.
원본 배열인 arr은 unshift메서드로 요소가 추가.
따라서 arr을 리턴하면 요소가 추가된 배열을 리턴한다.function addToFront(arr, element) { return arr.unshift(element); }unshift메서드는 배열의 가장 앞 요소를 추가한 후, 배열의 length를 리턴한다. 따라서 addToFront함수의 결과도 배열의 length. 문제의 예시의 경우 3이 출력된다.
slice메서드는 원본 배열을 변경하지 않고 새로운 배열을 복사 혹은 지정 범위만큼 잘라서(slice) 사용할 수 있다
function getElementsUpTo(array, n) { return array.slice(0, n); }slice메서드의 표준적인 사용법
0번째 요소부터 n번째 요소의 앞 요소까지 새로운 배열을 만들어 리턴function getElementsUpTo(array, n) { array.slice(0, n); return array; }slice메서드를 사용해도 원본 배열은 변하지 않기 때문에 원본 배열 array를 그대로 리턴
