자주쓰는 array methods

1. join() : 배열 -> string 하는 method

   // Q1. make a string out of an array
   {
     const fruits = ["apple", "banana", "orange"];
   
     const c = fruits.join()
   }

2. split() : 문자열들을 지정한 기준으로 구분해 배열로 return

   // Q2. make an array out of a string
   const fruits = "apple, kiwi ,banana, cherry"
   
   const result = fruits.split(',')
   // ['apple', 'kiwi', 'banana', 'cherry']
   

split은 두 번째 인자로 limit을 걸 수 있다. 이 두번째 값은 optionary 

const result2 = fruits.split(',', 2)
// ['apple', 'kiwi']

3. reverse() : 배열 안의 요소들을 반대로 만듬

   // Q3. make this array look like this: [5, 4, 3, 2, 1]
   
   const array = [1,2,3,4,5]
   
   const result = array.reverse()
   // [5,4,3,2,1]

   특이점 : array.reverse() 후에 array 에도 [5,4,3,2,1] 이 저장되어 있다. 유념하면서 쓰자!

4. slice(a,b) : 인덱스 a 부터 인덱스 b-1 까지 출력함

   // Q4. make new array without the first two elements
   const array = [1, 2, 3, 4, 5];
   const result = array.splice(2)
    

   특이점 : array.splice() 이후, array는 잘려나가고 난 나머지 부분이 남음

   그래서 본 배열을 바꾸지 않는 slice() 를 사용해야 함

const array = [1, 2, 3, 4, 5];
const result = array.slice(2,5)
  
console.log(result) // [3,4,5]

5. find()

   // Q5. find a student with the score 90
   
   class Student {
     constructor(name, age, enrolled, score) {
       this.name = name;
       this.age = age;
       this.enrolled = enrolled;
       this.score = score;
     }
   }
   
   const students = [
     new Student("A", 29, true, 45),
     new Student("B", 28, false, 80),
     new Student("C", 30, true, 90),
     new Student("D", 40, false, 66),
     new Student("E", 18, true, 88),
   ];

   find ( 콜백 함수(값, 인덱스, obj), ) : 배열들의 요소 마다 콜백 함수가 실행되고, 콜백 함수가 실행되고 나서 true 값을 return 할 시에 작동을 멈추고 true 가 되게 한 값을 리턴한다.

   students.find((students) => student.score === 90 )
   
   //	Student {
   //    name = C;
   //    age = 30;
   //    enrolled = true;
   //    score = 90;
   //  }

6. filter() :

   Q6. make an array of enrolled students
   
   students.filter((student) => student.enrolled === true)
   
   /* [
     Student {
       name: 'A',
       age: 29,
       enrolled: true,
       score: 45,
       __proto__: Student { constructor: ƒ Student() }
     },
     Student {
       name: 'C',
       age: 30,
       enrolled: true,
       score: 90,
       __proto__: Student { constructor: ƒ Student() }
     },
     Student {
       name: 'E',
       age: 18,
       enrolled: true,
       score: 88,
       __proto__: Student { constructor: ƒ Student() }
     }
   ]
   */

   filter(콜백함수(값,인덱스, obj 등) ) : 요소 마다 콜백 함수를 돌려서, true를 반환한 값들을 배열에 담아 리턴한다.

7. map()

   Q7. make an array containing only the students' scores
   result should be: [45, 80, 90, 66, 88]
   
   const result = students.map((student)=> student.score)
   
   // [45,80,90,66,88]

   map(콜백함수) : 매 요소마다 콜백 함수를 돌려서 나온 값들을 배열로 return 한다. 밑에 코드가 map() 용도를 이해하는 데 더 이해가 갈 것이다.

   const result2 = students.map((student)=> student.score * 2)
   
   //[90, 160, 180, 132, 176]

8. some()

   Q8. check if there is a student with the score lower than 50 
   
   const result = students.some((student)=> student.score < 50 )

   some() : 콜백함수에 해당하는 요소가 있는 지 없는 지를 true/false 로return 해준다. 하나라도 콜백 함수에 해당하면 true 를 반환함

every 를 사용해서 위의 result와 같이 출력할 수 있다.
every(콜백함수)는 모든 요소가 콜백함수를 충족해야 true 를 반환하고, 그렇지 않으면 false 를 반환한다.

//이렇게 하면 모든 학생의 점수가 50점 이상이여야 true
const result2 = students.every((students)=> students.score >= 50)

//이렇게 하면, 어떤 학생의 점수가 50점미만이면, 즉 some 을 쓴 결과와 같다. 이렇게 하면 복잡하니까 some() 을 쓰라는 의미이다
const result2 = !students.every((students)=> students.score >= 50)

9. reduce()

   Q9. compute students' average score
   
   {
     const result = students.reduce((prev, curr) => prev + curr.score, 0)
     console.log(result/5)
   }
   

   reduce( (previousValue, currentValue)=> 실행시킬 식 , previousValue 지정) 이다. 만약 콜백함수 뒤에 previousValue 를 지정해주지 않으면, previousValue 초기값은 배열의 인덱스=0 의 값이 들어간디.