오늘은 자바스크립트 라이브강의 쪽지시험 날이었다. 어제 강의가 조금 빡셌어서 시험 전에 강의자료 조금 더 찾아보고 했는데... 1시까지 다 못풀어서 점심먹으라고 쫒겨남 ㄹㅈㄷ
function deepCopy(o) {
var result = Array.isArray(o) ? [] : {}; /* 객체는 객체로, 배열은 배열로 */
if (typeof o === "object" && o !== null)
for (i in o) result[i] = deepCopy(o[i]);
else result = o;
return result;
}깊은 복사 문제에 있던 코드인데 실제로 이 함수를 항상 작성해서 쓰진 않는다고 하셨다. 하지만 재귀적..? 깊은 복사의 구조가 이러하니 알아두라고 강조하셨다. 실제로는 structuredClone 함수를 사용한다고.
Array.isArray(o) ? [] : {}; /* 객체는 객체로, 배열은 배열로 */이 부분은 따로 추가한 코드인데 Array.inArray 를 통해 대상이 배열인지 아닌지 확인하고 타입에 맞게 출력해준다.
얕은 복사
첫번째 계단의 값까지만 복사해준다. 두번째 계단부터는 주소를 그대로 끌고옴 (원본이나 복사본을 수정하면 같이 수정됨) 원본 === 복사본X 이지만 원본.참조 === 복사본.참조O => 아닐수도 있음 사실 아직도 헷갈림
깊은 복사
계단을 다 복사해준다. 어디서 어디를 수정해도 원본과 복사본 사이에 아무런 영향이 없음
메서드 응용 문제
문제가 꽤 많았는데 푸는 게 너무 재미있었다. 알고 있는 걸 어떻게 이용해야하는지 감각을 기르는 느낌?
// 객체 배열에서 name 속성이 null인 객체가 있는지 판별을 확인하는 코드를 작성하고 반환값을 출력해주세요
console.log("8.", student.some(e => e.name === null));특정 값을 찾아 있는지 없는지 확인하고 true false를 반환하는 건 some 메서드를 쓰면 된다. 해당 값이 있는지 없는지 확인하고 하나라도 있으면 불리언을 반환해주기 땜애...
// 문자열 길이가 5를 초과하는 요소가 있는지 검사하는 코드를 작성하고 반환값을 출력해주세요.
var answer = arr.filter(e => e.length > 5);
console.log("9.", answer.length>0 ? true : false);이건 문제 자체는 똑같은데 some을 안 쓰고 풀어봤다. filter를 사용해서 길이 5를 초과하는 것들을 걸러내서 answer에 넣고 삼항연산자를 이용해 answer에 요소가 하나라도 있다면 true를 반환하도록 만들었다.
하 그리고 처음에 썼던 풀다가 타임아웃 당한 문제...
// 주어진 학생 객체 배열에서 각 학생의 평균 점수를 계산한 후,
평균이 80점 이상인 학생의 이름만 필터링하여 출력해주세요.
가능하다면 메소드 체이닝으로 풀어주세요
const students = [
{ name: "이름1", scores: [80, 90] },
{ name: "이름2", scores: [90, 95] },
{ name: "이름3", scores: [75, 70] }
];그냥 눈물이 날 것 같았다. 대충 어떤 걸 써서 풀어야겠다 라는 건 떠오르는데 도대체 이걸 어떻게 써야할지를 모르겠어서.. 이것저것 써봤지만 오류만 잔뜩 봤고... 체이닝으로 꼭 풀고 싶었는데 점심먹고 와서 그냥 체이닝 무시하고 풀어봤다.
var average = [];
var answer = [];
students.forEach(e => {
average.push(
e.scores
.reduce((a, b) => a + b) / e.scores.length
)
});
for (let i = 0; i <= average.length; i++){
if ( average[i] >= 80){
answer.push(students[i].name);
}
}
console.log(answer);대충 forEach로 배열을 돌면서 reduce를 사용해서 평균을 구하고, 그 평균 점수를 순서대로 새 배열에 추가했다. 그리고 for문으로 점수가 80점이 넘는다면 해당 인덱스에 해당하는 이름을 정답 배열에 추가해서 그걸 출력하는 아주아주 초보자같고 뭔가 비효율적이어보이는 코드.
이렇게 마무리하자니 자존심이 상해서 바로 튜터님 찾아가서 코드를 보여드리고 더 간결하고 체이닝을 사용해서 풀고 싶은데 잘 모르겠다 어떤 걸 사용해야하나 물어보니 map이랑 filter를 같이 쓰면 될거라구...
근데 사실 map을 어떻게 사용해야하는지 잘 몰라서 못풀었던건데ㅎㅎ. forEach랑 거의 비슷하다고 말씀해주셔서 자리로 돌아와서 map 사용하는 법 찾아보면서 코드를 작성했다.
var answer = students
.map( e => {
e.average = e.scores.reduce((a, b) => a + b) / e.scores.length;
return e;
})
.filter( e => e.average >= 80)
.map( e => e.name);
console.log(answer);하 이거 진짜 장족의 발전. 다 쓰고 조금 뿌듯했다. 튜터님한테 가서 저 완성했어요!! 하고 자랑도 했당ㅎ.ㅎ
map이 forEach랑 비슷하다는 말에 깨달음을 얻었던 것 같다. 결국 배열을 다 돌아서 뭔가 해주는거잔냐? 그래서 배열에 평균값 키를 만들어서 평균 점수를 저장해주고 filter로 거른 다음 다시 map으로 해당 객체의 name만 반환하도록 만들었다.
처음에 막 써보다가 return e를 안쓰고 filter를 붙이니까 값이 안나오더라. 처음 돌린 map이 평균점수만 반환하기 때문에 filter가 안 돌아갔던 거였다. 그리고 중괄호 안에는 꼭 return값이 들어가야한다고..! 이건 몰랏지.
강의만 볼때는 계속 헷갈렸는데 이렇게 문제랑 같이 풀어보니까 확실히 이해가 잘 되는 것 같다. 조만간 멈춰둔 프로그래머스 문제도 다시 도전해보는걸루.
