7)JavaScript_ 배열(Array) 함수 모음

---

join()

모르는 기능이나 뭐 프로그래밍을 공부할때

라이브러리를 열어 공부 할때 역시

해당 API가 정의된곳으로 가서 사용법을 익혀야 한다

배열에 있는 모든 item들을 더해 string형으로 바꿔주는것

그냥 string으로 만들지 않고 전달해준 separator(구분자)를 통해 전달해준다

---

배열안의 데이터를 스트링형으로 바꿔라

구분자를 넣지 않았을땐 기본으로 , 가 들어가고 넣었을때

이렇게 구분을 지을수 있다

---

split()

아까와는 반대되는 개념

separator(구분자)와 limit(제한)을 전달 받는다

이 string을 여러개의 문자열로 나눠주는데

전잘된 구분자를 받아와서 우리가

return받을 배열의 사이즈 지정하는것도 가능하다

---

스트링형을 배열로 바꿔라

구분자를 줘서 저렇게 배열로 만들수 있고

이제 리밋을 걸면 저 배열의 사이즈도 조절이 가능하다

리밋은 솔직히 딱히 지정할 건 없으니 냅둔다 치고..

저 구분자를 없앤다면?

이렇게 하나로 취급해 버린다

---

reverse()

배열에 들어있는걸 반대 순서로 뒤집어 버리는거

---

배열의 순서를 뒤집어라

원래의 array를 reverse 해서 result에 담았지만

사실은

원래의 array도 같이 뒤집어진걸 알수있다

배열 자체를 뒤집고 리턴할때고 그 배열 자체를 리턴하구나~ 를 알수있음

---

slice()

배열의 특정한 부분을 return 하는 함수

시작(start)과 끝(end)을 지정해 나타낼수 있음

그런데 마지막에 오는 저 끝(end)은 배제하게됨

때문에 내가 4까지 받고 싶으면 5라써야된다

---

첫째 두째 인덱스 제외 나머지를 새 배열에 담아라

이걸 splice()를 써서 하면 이렇게...

0부터 2개를 잘라내라 해서 result에 담고 

나머지도 array도 담아낸걸 볼수있

 

그렇지만 하려는게 이게 아님... 새 배열 만들어 넣어야해

---

이거 가지고 진행 할거. .

find()

총 2가지의 인자가 전달되는걸 볼수있다

predicate와 thisArg

=> 가 있는걸 봐선 함수인거 같고..

아 이거 콜백 함수를 받는구나 하고알아야함

저달되는 인자로는 총 value, index, obj 이렇게 3가지만 전달되는걸 알수있고

value is S boolean으로 뭔가가 전달되는 그런 함수를 전달함 되구나~ 하고

                                                             읽으면 됨

 

---

점수가 90인 학생 찾아라

value 넣으라해서 students 넣었고

다음이 index니깐.. 넣고

parameter 연결해 출력하면~

5 명 나오네. .

다음 할게 90점인 학생!

콜백 함수로 student.score === 90 을 던져 값을 받아오는...

 

솔직히 원리는 뭐 라이브러리 읽으면 되고

그냥 아~ 이렇게 쓰는구나 만 알고 저대로만 쓰자 

 

---

filter()

이렇게 쓰면 된데. .

value, index, array 들어가고 콜백 함수 value is S 뭐 던져줘서, thisArg 이거  뭐 아규먼트 머시기 해서..

새로운 배열을 생성해주는거군

---

수업에 등록한 학생만 배열로 만들기

3명의 학생이 배열에 담겨 출력이 된다

그냥 저런식으로 쓰면 

---

map()

이번엔 학생이 아닌 학생들의 점수로만 배열로 만드는것

배열안에 들어있는 요소 한가지 한가지를 다른것으로 변환해주는걸 말함

사용법은 뭐. . 그렇다 치고

저기 콜백함수 만드는데 쓰는 파라메터부분을

그냥 알아보기 쉬우라고 student 라고 했는데

?????

value.score가 뭐여? 하고 당황말고

아~! students를 mapping 했구나 그럼 저 안의 score를 뜻하는거군

하고 좀.. 읽어낼줄 알아야 한다

전반적으로 전부 다

 

하지만 일반적으로 저런 콜백 함수같은경우.. 최대한 이해하기 쉽게 써야 맞지

---

내가 찾는게 이 배열에 있나 보는거

이대로 따라 쓰면 된다

콜백 함수는 저기 학생 5명을 상대로 하나하나 수해이 되는데

그 중 조건이 50보다 낮은 이니까

true 가 나오는것..

---

every()

배열에 들어있는 모든 요소들이 

해당 조건에 충족해야 true가 나오는것

결과는 같으나 저 둘의 차이는

- some : 배열중에 어떤것이라도 하 만족되는게 있는지 검사하는거

- every : 배열 안의 모든 요소들이 조건에 만족하는지 검사하는거

---

reduce()

콜백 함수로 받을 파라메터를

prev 이전값과

curr 지금값을 받을수 있는데....

이런것도 써본적 없어 모를땐 시키는대로 출력을 해나가며 알아가는거다

새 기술 나오며 그냥 함 찾도 보지만.. 반대로 라이브러리를 읽고 해석 할줄도 알아야지

 

---

평균 구하기

보면 알겠지만 저기 A랑 B | B랑 C | C랑 D | D랑 E

이렇게 비교를 하고 있네

이 currentValue 라는건 저기 배열을 하나하나의 값을 말하는데

마지막 return 값으로 currentValue 뺏으니까 그게 다시 

previousValue 지금값으로 들어가 뺑뺑뺑 도는...

 

하지만 원하는건 학생들 모든 점수를 더해 평균을 구하는거니까

initialValue 값을 0으로 전달하게 되면

처음엔 A 학생부터 시작이던 값이 0으로 초기화가 된거고

 

return 값을  prev + curr.score로 한 이유는

더해서 prev로 넣고 나오면 또 더해서 넣고 를 하려는것

 

그래서 이 reduce는 어떤 값을 누적 하고싶을때 쓰는거

previousValue 는 이전에 콜백함수에서 return된 값이 전달되어 지는것

currentValue 는 배열의 아이템을 순차적으로 전달받는거

 

그럼 필요없는건 좀 지우고 간단히 만들면

---

응용하기

학생들의 모든 점수를 string으로 만들기

 

아까 했던걸들을 응용해야함

먼저 map을 사용하여 스코어만 따로 배열로 만든 다음

join()을 써서 string으로 만들면 된다

---

이렇게 연결이 된다는건. . . 이런식으로 쓸수있어 편하단 거지

이런식으로 묶어 쓰면

간편하고 유용해서 이런걸 함수형 프로그래밍 이라고 한다

---

sort()

내림차순으로..

이렇게 쓰면 되는거고..

 

저기 라이브러리 보니깐

뭐. . . 이렇게 쓰는거라던데

몰라 나중에 알아보기로.. ㅎ

 

기술면접 시험때 이거 아냐 물어본다네..

직접 사용해보며 공부해야 알수있지

무지성 외는게 아님