일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
- 자스민
- 스위프트
- data structure
- 호키도키
- 계명대 이종호
- 리액트 예제
- SWIFT
- 힛잇
- 자료구조
- 스벨트
- 리액트
- 자바스크립트 자료구조
- hokeys
- HTML
- Svelte
- Hitit
- jest
- 개발
- react
- 계명대
- queue
- javascript
- 이종호
- 개발자
- 비동기
- 자바스크립트
- hokidoki
- IOS
- 호키스
- TDD
- Today
- Total
Dog foot print
배열 [] 에 관하여 본문
배열은 다른언어에서는 같은 데이터타입이 메모리상 선형구조로 있는 자료구조를 말한다. 그러나 자바스크립트에서는 배열에 다른 데이터 타입이 들어가도 작동된다. 배열은 우리가 코드를 작성할때 코드의 라인을 여러개 쓰지 않고 각기 다른 메모리에 작성할 수 있는 이점이 있다.
배열의 구성
배열은 key와 value로 구성된다. 배열은 메모리가 연결되어 있는 모습을 하고 있는데, key는 배열에 담겨있는 값 (value)를 찾기 위해 사용되는 메모리의 번호이다.
배열의 0번 방에는 "h" 가 들어있는데 이때 0번방에 해당하는 번호가 key이다. (배열의 첫번째 방은 0부터 시작한다. )
배열의 선언과 사용
var array = []; //선언
var array = [1,2,3,4,5,6,7,8,9,10] // 선언과 동시에 할당
array[4] = 12; //이제부터 array 4번 key의 값은 12다.
array[0] = 0;
배열의 선언은 변수에 [] 대괄호를 할당하는 것만으로도 이 변수가 배열이라는 것을 할당할 수 있는데, 배열의 선언과 동시에 할당을 하고 싶으면 [] 대괄호안에 콤마로 구분지어 각 방에 값을 할당하면 된다.
( 자바스크립트에서 배열은 c언어의 배열과 연결리스트를 섞은 자료구조의 모습을 하여 배열의 길이가 무한하다. )
배열에 들어있는 값을 재 할당 하거나 추가 하고 싶으면 변경하고자 하는 key를 array[key] 넣어 작성하고 할당 해주면된다.
배열의 길이
배열.length 를 사용해서 이 배열이 가지고 있는 방의 갯수를 알 수 있는데 이를 배열의 길이라고 한다.
var array = []; //선언
var array = [1,2,3,4,5,6,7,8,9,10] // 선언과 동시에 할당
console.log(array.length)//결과는 10
배열의 길이는 key와 달리 1번부터 시작한다.
배열의 삽입과 삭제
배열에 할당할때는 array[5]= 'value' 형태로도 할 수 있지만 배열에 사용할 수 있는 메서드라는 일종의 함수를 이용하면 맨뒤에서 부터 추가 하거나 삭제 할 수 잇다.
var array = []; //선언
var array = [1,2,3,4,5,6,7,8,9,10] // 선언과 동시에 할당
console.log(array.length)//결과는 10
array.push(11,12,13,14); //배열은 [1,2,3,4,5,6,7,8,9,10,11,12,13,14]가 된다.
array.pop() // 배열의 마지막에 있는 방을 제거한다. [1,2,3,4,5,6,7,8,9,10,11,12,13]
배열의 유용한 메서드들
var array = []; //선언
var array = [1,2,3,4,5,6,7,8,9,10] // 선언과 동시에 할당
array.splice(1,2,"10","30"); // array변수는 이제부터 [1,"10","30",4,5,6,7,8,9,10]으로 변환
var b = array.splice(1,2,"10","30");
splice 메서드는 특정 key부터 key까지 값들을 바꿔주고 바꾸니 배열을 반환해준다.
splice메서드의 파라메터는 다음과 같다. splice(바꾸려는 시작점 key,종료되는 key,재 할당될 값들...);
var array = []; //선언
var array = [1,2,3,4,5,6,7,8,9,10] // 선언과 동시에 할당
var b = array.slice(1,4); // b배열은 [2,3,4,5]
slice함수는 splice와 매우 유사한데 splice와 다르게 값을 변환 하는것이 아니라 배열의 일부분을 자른다음 반환한다.
slice메서드의 인자는 파라메는 다음과 같다. slice(자르기 시작할 key,종료되는key)
var array = []; //선언
var array = [1,2,3,4,5,6,7,8,9,10] // 선언과 동시에 할당
array.foreach(function(value){
console.log(value);
})결과는 1부터 10까지 출력
for(var i=0; i<array.length; i++){
console.log(array[i]);
}
1부터 10까지 출력하는 반복문
foreach 메서드는 배열에 들어있는 각각의 값들을 파라메터로 전달받은 함수의 인자로 전달하는 메서드이다.
for문을 통해 배열에 있는 것들을 사용 할 수 있지만 foreach 문이 조금 더 엘레강스 해보인다.
정리하며
배열은 내 코드라인을 var와 let으로 범벅되지 않게 도와준다. 자바스크립트에서 제공하는 배열의 다양한 메서드는 이 포스팅에서 다 담지 못했는데 혹시라도 배열의 다양한 메서드를 사용해보고 싶으면 꼭 구글링해서 사용해보길 바란다.
글을 쓰며 실수로 뒤로가기 버튼을 눌렀는데 이는 오늘 정리하며 까지 2번 적어야하는 불상사를 불러왔다. 절대 누르지 말자 ....
'Javascript' 카테고리의 다른 글
자바스크립트의 객체란 무엇인가 ? (2) (0) | 2019.06.29 |
---|---|
자바스크립트의 객체란 무엇인가 ? (1) (0) | 2019.06.29 |
함수란 ? function 그 함수가 그 함수요 (0) | 2019.06.28 |
귀찮은 일을 대신해주는 반복문 for , while. (0) | 2019.06.27 |
제어문 if 와 switch, 삼항연산자 (0) | 2019.06.25 |