TIL Array APIs(2)

dory·2021년 3월 23일
0

TIL_JS

목록 보기
4/6

[05~11]

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)
];

05. find a student with the score 90 : find

# what I did

if (this.score === 90) {
    const goodStudent = console.log(this.name);
    return goodStudent;
} else {
    `there is no good student.`
}

-> 90점인 학생을 찾고 싶었다.. ㅎㅎ 위의 오브젝트가 도대체 왜 저렇게 생긴걸까,, 학생을 찾으면 뭐라고 불러야하나 고민한 결과이다..ㅎ하하하하하핳

# what Ellie did

const result = students.find((student) => student.score === 90);
console.log(result);

.find(callback[, thisArg]) : 주어진 판별 함수를 만족하는 첫 번째 요소의 값을 반환합니다. 그런 요소가 없다면 undefined를 반환합니다.

  • callback
    배열의 각 값에 대해 실행할 함수. 아래의 세 인자를 받습니다.
  • element
    콜백함수에서 처리할 현재 요소.
  • indexOptional
    콜백함수에서 처리할 현재 요소의 인덱스.
  • arrayOptional
    find 함수를 호출한 배열.
  • thisArg
    선택 항목. 콜백이 호출될 때 this로 사용할 객체.

-> this가 뭔지 안다고 생각했는데,, 전혀 모르겠다. find설명도 잘 모르겠고, 해당 조건을 만족하는 첫 번째 아이를 불러온다고 생각하련다..ㅎㅎㅎㅎㅎㅎ...

06. make an array of enrolled students : filter

# what I did

const enrolledArr = students.filter(s => s.enrolled === true);
console.log(enrolledArr);

-> 단순히 's'라고 적는 습관은 고치자!
-> 사실 콜백함수를 이렇게 불러도 되는 건지 내가 뭘 하고 있는 건지 알듯말듯.. 모르겠다. .. ^^ 그래도 성공했네.. 무야호
-> 난 enrolled 값이 true인것만 가져와야지하고 ===을 사용했다. 으흠..! 작동된거 맞겠지..?

# what Ellie did

    const result = students.filter((student) => student.enrolled);
    console.log(result);

-> 어차피 filter가 참인 것만 가져오니까 비교할 필요가 없나보다..!

filter(callback(element[, index[, array]])[, thisArg]) : 함수 조건에 해당하는 요소만을 모아 새로운 배열 생성

  • callback
    각 요소를 시험할 함수. true를 반환하면 요소를 유지하고, false를 반환하면 버립니다. 다음 세 가지 매개변수를 받습니다.
  • element
    처리할 현재 요소.
  • index Optional
    처리할 현재 요소의 인덱스.
  • array Optional
    filter를 호출한 배열.
  • thisArg Optional
    callback을 실행할 때 this로 사용하는 값.

-> 오우.. 몰라..

07. make an array containing only the students' scores (result should be : [45,80,90,...])

# what I did

const scores = students.map()

-> 문제로 보고 이건 맵이야!를 속으로 외쳤지만,,, 점수만 어떻게 불러와야할지 한참을 고민했다. 그리고 패쓰! 엘리님 동영상 보고 배울게요~!?하면서도 속으로 패배한 느낌을 지울 수 없었다..
mdn예시에서는 값을 두배로 바꿔 불러오고,, 난 그냥 점수만 불러오고싶은건데 정녕 맵이 맞는 건가 고민끝에 정말 끝났다. ^^.. 내가 이해한 map은 함수값을 통과하는 아이들로 새로 배열을 만드는 건데,,! 그걸 어떻게 하는 건지 알 수 없었다~~ 아는게 없네.. 위에 지정된 오브젝트가 도대체 왜 저렇게 생긴건지 이해가 안되니까 점수를 어떻게 불러와야할지 감도 안잡혔다.

# what Ellie did

const result = students.map((student) => student.score);
console.log(result);

08. check if there is a student with the score lower than 50

# what I did

const result = students.some(student => student.score < 50);
console.log(result);

-> 위에서 점수를 어떻게 불러오는지 봤고, 한 명이라고 있는 지 확인하면 되니까 some을 사용했다.

# what Ellie did
-> every를 사용하는 방법을 알려주셨다.

09. compute students' average score

# what I did

const scores = students.map((student) => student.score);
const sum = scores.reduce((sum, currScore) => sum + currScore);
const m = sum / scores.length;
console.log(m);

-> 점수만 가져와서, reduce로 합계를 구하고 length로 나누어서 평균을 구하려했다.

# what Ellie did

const result = students.reduce((pre, curr) => pre + curr.score, 0);
console.log(result / students.length);

-> 간결한 코드에 고수란 이런 것이구나를 느꼈다.. 그리고 꼭 값을 선언할 필요가 없다는 걸 알게 되었다.
-> 음.. 근데 음..음.... 점수 배열을 만들지 않고 불러올 수 있구나.. 아 그래서 0부터 시작해서 curr.score을 계속 쌓아간건가??
-> 뒤에서부터 값을 더하고싶으면 reduce.right사용하기!

10. make a string containing all the scores (result should be : 45, 80, 90, ...)

# what I did

const arrSco = students.map(student => student.score);
const strSco = arrSco.toString();
console.log(strSco);

->점수를 모아놓고, string으로 변환하려 했다.

# what Ellie did

const result = students
        .map(student => student.score)
      //.filter(score => score > 50)
        .join();
console.log(result);

-> method를 이어서 적용할 수 있군!
-> join이랑 toString의 차이가 뭔지 알아봅세

  • join : array의 모든 요소를 하나의 문자열로 만듦
    toString : .. object의 속성을 string으로 반환..?
    조금더 큰 개념인가..?

11. sorted ascending order (result sholud be: '45, 66, 80...')

# what I did

const result = students
        .map(student => student.score)
        .sort()
        .join();
    console.log(result);

-> 점수만 모아서 내림차순으로 분류하고 문자열로 합쳐서 출력

# what Ellie did
sort((a,b)=> a-b):내림차순, .sort((a,b)=> b-a):오름차순

30분정도 위밍업으로 들어볼까 했던 9강.. 다시 정리하면서 보니까 또 새롭다 ~~~ 오늘도 새로운 걸 배웠구나아ㅏㅏ 행복해 하하하하하ㅏㅎㅎㅎㅎ 잘하고 있다아ㅏㅏㅏㅏ

0개의 댓글