Prototype Inheritance 문제 연습 1

1. getEvens 이라는 프로토타입 기능을 만들어라. 이 기능은 배열 내 짝수만 포함하는 새로운 배열을 리턴한다.

const arr = [9, 80, 12, 2]
arr.getEvens() // return [80, 12, 2]

 

풀이 전 생각)

• 새로운 배열을 만들어야하므로, 배열을 저장하는 내부 변수를 생성한 뒤 짝수를 push 해준다.
• 인자로 사용된 배열을 모두 순회했다면 만들었던 내부 변수(배열)을 return 한다.

 

풀이)

Array.prototype.getEvens = function(i = 0, result = []) {
    if (this.length === i) return result
    if (this[i] % 2 === 0) result.push(this[i])
    return this.getEvens(i + 1, result)
}

1. 프로토타입 기능을 만들어야 하므로, Array.prototype.getEvens 에 함수를 할당해서 제작한다.
2. 인자로 받은 배열의 길이만큼 모두 순회했다면 result를 return한다.
3. 인자로 받은 배열 내 요소의 값이 짝수라면 그 값을 result에 푸쉬해준다.
4. this.를 통해 해당 기능을 선택해준 뒤 재귀한다.

 

답지 풀이)

Array.prototype.getEvens = function () {
	return this.filter(e => {
    	return e % 2 === 0
    })
}

1. filter 메서드를 이용해 답을 풀어낼 수 있었다!

※ filter 메서드는 배열을 생성하는 기능으로, 조건이 true일 경우, 그 요소의 값을 새로운 배열에 push 한다.

 

 

---

 

2. sum이라는 프로토타입 기능을 만들어라. 이 기능은 배열 내 모든 요소들을 더한 값을 리턴한다.

(문자열을 더하는 것도 포함한다)

const arr = [9, 80, 12, 2]
arr.sum() // returns 103

 

풀이 전 생각)

• 모든 요소를 더한 값(즉 누산한 값)을 리턴해야 하므로 reduce 메서드를 이용한다.
• reduce의 인자를 어떻게 추가할지 고민해본다.

 

풀이)

Array.prototype.sum = function() {
    if (this.length === 0) return undefined
    return this.reduce((acc, e) => {
        return acc + e
    })
}

1. Array.prototype.sum으로 함수를 생성해서 프로토타입 기능을 선언한다.
2. 만약 길이가 없는 배열을 받았다면 undefined를 리턴한다.
3. reduce를 통해 각 요소를 누산한다.

 

답지 풀이)

Array.prototype.sum = function () {
  if (this.length === 0) {
    return undefined
  }
  let startingValue = ''
  if (typeof this[0] === 'number') {
    startingValue = 0
  }
  return this.reduce((acc, e) => {
    return acc + e
  }, startingValue)
}

• startingValue를 선언하는 것이 내 코드와 다른 부분이다.
• 그냥 없어도 되겠지 싶었는데 위의 코드에서는 startingValue를 만들어서 굳이 넣어주었다.
• 일단 참고는 해놓자.

 

---

 

3. pad라는 프로토타입 기능을 제작해라. 이 기능은 반복할 숫자와 문자열을 받고, 배열에 문자열을 숫자만큼 추가해준다.

const arr = ["<button name='submit'></button>", '<div></div>']
arr.pad(2, '<br/>')
// arr is ["<button name='submit'></button>", "<div></div>", "<br/>", "<br/>"]

 

풀이 전 생각)

1. 기본 배열에 push를 사용한다.
2. 재귀를 통해 입력받은 숫자만큼 기능을 실행한다.

 

풀이)

Array.prototype.pad = function(num, pad, i = 0) {
    if (num <= i) return this
    this.push(pad)
    return this.pad(num, pad, i + 1)
}

주의사항)

• push 메서드를 이용할 때에는 return을 붙일 때 주의해야 한다.
• 기존 배열에 요소를 붙이는 기능과 별개로, push를 리턴하면 그 배열의 길이(숫자)가 리턴된다.

 

답지 풀이)

Array.prototype.pad = function (num, str) {
  if (num <= 0) {
    return this
  }
  this.push(str)
  return this.pad(num - 1, str)
}

• 답지에서는 별도의 인덱스를 두어 입력한 인수와 비교하지 않았다.
• 그냥 인수를 줄여서 카운트 했다.
• O(1)이긴 하지만 상당히 좋은 방법 인듯.

 

---