*여러타입 한번에 한 배열에 담을 수 있슴 ..... ; -> 근데그러지 않는게 조음.. 웅웅..
배열 선언
1. const arr1 = new Array();
2. const arr2 = [ 1,2 ] ; //이게 더 흔하게 쓰임
접근 -> [인덱스] 로 !! ( 0부터 ~ arr.length-1 ^^ )
arr2[0]; 이런식으로
loop, 각각 출력
1.
for (let i = 0 ; i< arr.length ; i++){
console.log(arr[i]);
}
2.
for( let a of arr){
console.log( a );
}
3. forEach 사용 !
foreach 는 배열안에 들어있는 벨류들마다 내가전달한 함수대로 출력한다
forEach(콜백함수(value, index, array) => void ) 이렇게 콜백함수가 들어가는 것이다
근까 배열.forEach 하면
그함수에 value, index, array 를 매개변수로 가진 콜백함수가 인자로 들어간다
그리고 그 배열에 value 개수만큼 foreach 함수가 반복된다
그리구 콜백함수의 value, index, array 은 foreach함수 내에서 그 배열의 value, index, array 가 된다
그리구 array는 잘 쓰지 않는다
ex
const fruit = [1,2,3,4];
fruit.forEach(function(a, index, array){
console.log('de'); //4번 반복됨
console.log(a, index, array); //fruit 의 value-해당 index-fruit 전체가 다 출력되게 됨
})
=>
fruit.forEach((a, index)=>console.log(a, index));
fruit.forEach((a)=>console.log(a));
이렇게 이름없는 function 은 이렇게줄여쓸수잇긔 !!
요소 넣고 빼고 복사하기
1. 맨뒤에 add
배열이름.push(머시기);
2. 맨 뒤에꺼 remove
배열이름.pop();(-> 나가는 애가 리턴됨)
3. 앞에 add배열이름.unshift(넣을것들);4.앞에꺼 remove배열이름.shift();-> shift 와 unshift 는 정말정말 느리다 -> 되도록 사용노노 pop 은 정말정말 빠릅니다왜냐면 앞에넣으려면 뒤에꺼를 다 한개씩 뒤에 넣어야하기때문이다 전체가 다 움직여야하기때문이다 ㄷ ㄷ노답
5. 지정된 포지션을 remove
배열이름.splice(시작 index, 개수);
개수말안하면 해당 index부터 끝까지 다 지워버림!
.splice(index, 개수, 넣을친구들 .. 여러개가능);
-> 해당인덱스에 넣을것들이 들어감
*넣기만하기 가능!
array.splice(1,0,넣을거)
하면 해당 인덱스에 아무것도 안지워진후들어감 ~ 굳뜨
(리턴값은 지워지는 것들)
6. 두 배열 combine
배열이름.concat(뒤에 합칠배열);
-> 두 배열 합친거 만들어짐
const newArray=배열이름.concat(뒤에 합칠배열);
searching
//index 알려줌
배열이름.indexOf(요소) -> 인덱스 나옴
(없으면 -> -1 나옴 ! 유용)
//include
배열이름.includes -> true/false 나옴
//last index of
*여러개있을 때 indexOf하면 젤 먼저있는 인덱스나옴
배열이름.lastIndexOf 하면 마지막에 있는 인덱스 나옴
배열 관련 유용 함수들 ! array API ~
1. join : 배열 -> string 리턴
const string = 배열.join(구분자?(스트링));
-구분자 안써도됨 ! (기본 = ',' !!)
(?= 받아도되고 안받아도 된다)
-string 리턴함
2. split : string -> 배열 리턴
const array=string.split(구분자(스트링), 배열사이즈?(number));
- 문자열을 구분자 단위로 나눠서 배열에 저장함 (구분자 필수)
- 배열 사이즈도 지정 가능 (안해도 됨) (받고싶은 개수만 받을 수 있는겨)
3. reverse() : 배열 자체 순서 거꾸로
arr.reverse();-> 배열 자체를 순서 거꾸로 만듬 (그 거꾸로 배열도 리턴해줌)
4. splice : 배열 자체를 수정하는 것arr.splice(index, 개수); ->배열 자체에서 애들 삭제-> 삭제된 애들을 리턴함
5. slice : 배열의 특정한 애들 리턴const arr2=arr.slice(시작 인덱스?, end 인덱스?);-(1,4) 이렇게 전달하면 1,2,3 인덱스만 가져옴. 마지막꺼는 빼고 ! (배제됨. exclusive)- 원하는 인덱스애들만 담겨있는 배열을 리턴함!
6. find : 함수로 true false 검사하고 true면 탈출하고 그 벨류 리턴- 콜백함수 : 배열에 있는 요소마다 함수가 한번씩 호출됨-> 함수 값이 true가 나오면 이 find 메소드가 멈추게 되고 첫번째로 truer가 된 value를 리턴한다const result = 배열.find((value) => value.score===90 );(콜백함수의 리턴값은 if문 처럼 검사하고싶은 문구 넣으면 됨 ! true/false 나오도록
7. filter : 콜백함수가 true인 애들만 모아서 새로운 배열 리턴const arr = 배열.filter((value)=>value.a===3);
const arr = 배열.filter((value)=>value.enrolled);
(enrolled 자체가 true/false 면 이렇게만하묜댐
8. map
각각의 요소를 콜백함수 거쳐서 다른 값으로 만들어주고 그 배열을 리턴함
(콜백함수에서 가공된, 콜백함수에서 리턴된 값으로 해당 요소를 바꾸는거 !)
const arr2=arr.map((value)=>value.score);
* 콜백함수에서 value, item 이런식으로 말고 student / fruit 이런식으로 나타내는 걸 변수 이름으로 해주긩 이해쉽도록
9. some
콜백함수 트루가되는 배열 요소가 있는지 없는지 알려줌 -> t/f 리턴
const result = arr.some((value)=>value<50);
배열중 50 보다적은게 하나라도 있다면 true 리턴
10. every
배열 모든 요소가 콜백함수 만족시켜야 true
const result = arr.some((value)=>value<50);
모든 값이 50보다 작아야 true 리턴
11. reduce : 누적하기 위해 사용, 그리고 마지막 값이 return 됨!
const result = arr.reduce((prev, curr)=>{~ return 머시기; }, initialValue (0같은거) );
( reduce(콜백함수, 초깃값) )
-curr = 하나하나의 요소 순차적으로 전달됨
-prev = 그 전콜백함수에서 리턴된 값!. 맨처음에는 전달한 initial value값임 (이니셜벨류지정안하면 걍 인덱스0인애, 그리고 curr이 1)
ex ) 배열 숫자 다 더하기
const result=arr.reduce((prev,curr)=>prev+curr,0);
=> 배열숫자 다 더해짐 ! ( prev는 누적되는 숫자가 되고 ,curr은 해당 현재 인덱스 배열요소가됨)
*reduceRight : 배열꺼꾸로할때
12. sort : 정렬함. 자기자신도바꾸는거가틈. 그리고자기자신도리턴함
arr.sort() -> 오름차순 정렬 (기본)
원래
arr.sort(콜백함수);
콜백함수
(a,b)=>a-b => 오름차순
a = 앞에 오는 값
b = 뒤에 오는 값
리턴값이 음수 => 앞에값 a가 작다고 간주되어서 a b 순서로 정렬된다
=> -붙이면 내림차순됨 !
*콘솔 지우는법
console.clear();
*언노니머스 펑션 한줄임 => {} 이거안쓰고 Return도 안쓰고 ; 도 안씀!!
'draft > html, javascript' 카테고리의 다른 글
json (0) | 2021.06.19 |
---|---|
object (0) | 2021.06.14 |
자바스크립트 데이터 타입 (0) | 2021.06.02 |
javascript (0) | 2021.05.21 |
css (0) | 2021.05.18 |