-
[Day 26] JS 객체자료형 - ArrayTIL/멋쟁이사자처럼 FE스쿨 2기 2022. 5. 3. 17:32SMALL
지난 시간엔 원시자료형에 배웠다면
오늘은 객체자료형에 대해 배웠다.
객체자료형(참조자료형)은
객체를 생성하여 값을 할당하고 그 값을 복제하면 값 자체를 복제하는 것이 아니라
그 값이 위치한 주소를 복사한다.
리터럴표현: {}
객체자료형 중에서도 오늘은 Array란 무엇이고 내장 함수/메서드에 대해 알아보고 실습하는 시간을 가졌다.
배열이란?
한마디로 데이터의 집합이다. 여러 데이터를 하나의 이름으로 묶어 사용할 수 있도록 도와준다.
데이터엔 원시자료형도 올 수 있고 객체자료형도 올 수 있다.
배열 안에 있는 데이터를 element라고 부른다.
리터럴표현:[]
많은 내장함수들이 있는데,
(더 많은 함수들이 궁금하다면 아래 클릭!)
https://daheejo.tistory.com/13?category=1249834
[JS]어쩌다 까먹는 자바스크립트 배열 메소드/함수 총정리
.pop 맨 뒤에 있는 원소를 추출하고 그 원소는 제거된다. const numbers = [10, 20, 30, 40]; const value = numbers.pop(); console.log(value); //40 console.log(numbers); //[10, 20, 30] .push 추가하고 싶은..
daheejo.tistory.com
그중에서도 자주 쓰이는 함수들
pop
push
splice
var avengers = ['spiderman', 'ironman', 'hulk', 'thor']; // splice() : 기존의 요소를 삭제하거나, 교체하거나, 새 요소를 추가합니다. 인덱스, 카운트, 아이템 순서로 인자를 전달합니다. // 아이템 삭제. avengers.splice(3, 1); // 3번 인덱스 요소 하나만 삭제 avengers.splice(3); // 3번 인덱스부터 전부 삭제 // 아이템 추가 avengers.splice(3, 0, 'blackwidow'); // 아이템 교체 avengers.splice(1, 1, 'hulk'); //시작 아이템 하나만 쓰면 스타트에서 끝까지 다 삭제!
slice
수업 중 실습한 것.. 주의할 점은 인덱스를 -값을 써도 자르는 순서는 양의 방향이다! sort와 그 안의 compare function 오늘 배운 메소드 중 가장 중요한 내용을 다뤘던 sort!
배열 안 요소들을 정렬할 때 쓰는 element다
문제는 숫자를 정렬할 때는 유니코드 순서대로 정렬이 되기 때문에
오름차순, 내림차순대로 제대로 정렬이 안된다.
이런 숫자형 데이터 정렬의 단점을 해결하기 위해선
sort 함수 안에다 비교함수(compare function)을 사용할 수 있다!
arr.sort ( functijon (a,b) { return a-b; } //오름차순 ) arr.sort ( functijon (a,b) { return b-a; } //내림차순 )
var arrNum = [13, 9, 10, 2]; arrNum.sort(function (a, b) { if (a < b) { return -1 } else if (b < a) { return 1; } else { return 0; } }); //내림차순은 등호 반대로
반응형'TIL > 멋쟁이사자처럼 FE스쿨 2기' 카테고리의 다른 글
[Day 28] 3번째 스프린트 회고 & JS 반복문 - for, while (0) 2022.05.10 [Day 27] JS Array - filter, find, map (0) 2022.05.06 [Day 25] JS 변수와 String, Boolean, Object 자료형 (0) 2022.05.02 [Day 24] 모던자바스크립트 튜토리얼 보라님과 함께 하는 깃/깃헙 특강 (0) 2022.04.30 [Day 23] JS 변수와 숫자 자료형, 관련 함수(메서드) (0) 2022.04.28