티스토리 뷰
배열의 선언
배열 선언 형식
var a = [ ];
- 배열 안에는 모든 타입이 다 들어갈 수 있다.
- 함수도 배열안에, 배열도 배열안에 들어 갈 수 있다. 즉 못들어가는게 없다.
예제)
1
2
3 |
var a = [1,2,3,"hello",null, true, [[{1:0}]]];
console.log(a.length); |
cs |
- new Array() 문으로 선언 할 수도 있지만, 보통 간단히 '[]'를 사용한다. 현업에서도 거의 사용하지 않는다.
예제)
1
2
3
4 |
var a = [4];
a[10000] = 10;
console.log(a.length);//10001
console.log(a[500]);//undefined |
cs |
- length 속성이 있어 길이를 쉽게 알 수 있다.
- index 번호와 함께 추가 할 수 있다.
1
2
3
4 |
//push 메서드
var b = [4];
b.push(5);
console.log(b.length); |
cs |
- push메서드를 통해서 뒤에 순차적으로 추가 할 수 있다.
배열의 유용한 메서드들
1
2
3
4
5
6 |
//배열의 원소에 특정 값이 들어 있는지 확인할 수 있다.
[1,2,3,4].indexOf(3) //2 (index가 출력된다. 만약 존재하지 않는다면 -1을 반환한다.)
//배열의 문자열로 합칠 수 있다.
[1,2,3,4].join(); //"1,2,3,4"
//배열을 합칠 수 있다.
[1,2,3,4].concat(2,3); //[1,2,3,4,2,3] |
cs |
indexOf(찾을 값) : 찾을 값이 존재하는 인덱스를 반환한다. 존재하지 않는다면 -1
1
2
3
4 |
var origin = [1,2,3,4];
var result = origin.concat(2,3); //origin은 바뀌지 않는다!
console.log(origin,result); |
cs |
concat(합칠 배열) : 배열을 합칠 수 있다. 합치고나서 새로운 배열을 반환한다. 원래 배열은 바뀌지 않는다.
- 배열의 메서드 중에는 새로운 배열을 반환하는 메서드도 있다는 걸 주의하자
배열 탐색 - (forEach, map, filter)
- for문은 생략
forEach
- i++과 같은 증가시켜주는 코드 불필요
- 함수를 인자로 갖는다.
- 스프레드 오퍼레이터에 대해 알아보기
예제)
1
2
3
4
5
6
7 |
var origin = [1,2,3,4];
var changedArray = [...origin,2,3];
changedArray.forEach(function(v,i,o){ //forEach문은 함수를 인자로 받고있다.
console.log(v);
});
|
cs |
map
1
2
3
4
5
6
7
8 |
var origin = [1,2,3,4];
var changedArray = [...origin,2,3];
var mapped=changedArray.map(function(v){
return v * 2; // changedArray의 원소를 돌면서, 값을 변경시킨 후에 새로운 배열로 만들어서 반환한다!
});
console.log(mapped, changedArray); |
cs |
참고 사이트 : http://www.edwith.org/
※
본 게시물은 개인적인 용도로 작성된 게시물입니다. 이후 포트폴리오로 사용될 정리 자료이니 불펌과 무단도용은 하지 말아주시고 개인 공부 목적으로만 이용해주시기 바랍니다.
※
'웹 > 부스트코스' 카테고리의 다른 글
[WEB]이벤트 버블링과 이벤트 위임(Event Bubbling and Event Delegation) (0) | 2018.07.29 |
---|---|
[WEB]Ajax 응답 처리와 비동기 (2) | 2018.07.27 |
[WEB]Maven이란? (0) | 2018.06.29 |
[WEB]JSTL(JSP Standard Tag Library) (0) | 2018.06.29 |
[WEB]EL(Expression Language) (0) | 2018.06.28 |
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- 파이썬
- 웹
- 파이썬 연산자
- 파이썬 예제
- css 그리드
- 파이썬 진수 변환
- 파이썬 함수
- 백준
- 명품 c++ 실습
- 파이썬 객체
- 파이썬 리스트
- 파이썬 while
- 자바
- 파이썬 클래스
- 파이썬 단계적 개선
- css
- 자바스크립트 자료구조
- 파이썬 터틀
- 파이썬 if문
- 파이썬 for
- 자바스크립트 그래프
- 버츄어박스
- 파이썬 문자열
- 백준 1874
- 자바 에센셜 실습문제
- 백준 10451
- 백준 11501
- 자료구조
- css 박스
- 파이썬 선택문
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
글 보관함