[취업준비일지] - 99

1.윤진님에게서 props로 조건을 넘겨줘 문제를 해결하는 방식에 대한 질문이 들어왔는데
자세히 들어보니 props를 통해 내부 attribute를 관리해 재사용성을 높이려는 것이었다.

나는 값을 각각 다 넣어준 다음 삼항연산자 또는
기본 값을 false로 둔 다음 해당하는 옵션들을 다 생성해서
아래와 같은 방식으로 넣어주는 방식을 생각했지만

<input disabled = {setting.disabled} onClick = {setting.onClick}>

 

그러면 또 너무 복잡해져서 다른 방식을 찾는다고 하셨다.

얼마 뒤 윤진님에게 다시 연락이 왔는데
이 문제는 구조분해 할당으로 해결할 수 있다는 것을 알려주셨다.

input에 들어갈 내용들이 있는 경우
받을 내용을 태그 내에 구조분해 할당으로 넣어버리면 
신기하게도 내부에서 알아서 풀리는 것을 볼 수 있다.

Input = ({type, name, label, options}) =>{
  return (
    <>
      <input type={type} name={name} {...options}>
    </>
  )
}


input type={type} name={name} {...options} />
//여기서 options는 이중객체 형태로 들어간다
//<input options={{onBlur:"", placeholder:"id를 입력해주세요"}}

 

작성해보고 취향상 지나친 재사용보다는

용도에 맞게 몇개를 사용하는 것이 더 편할 것 같기는 하지만

이런 방식으로 props를 통해 태그 내부 attribute를 관리하는 방식은 편리할 것 같다.

 

 

 

(1).백준 4673 셀프넘버는 특정 규칙에 따라 만들어지지 않는 숫자를 말한다.
a라는 숫자가 있다고 할 때 
a와 a의 각 자릿수를 합해 만들어지지 않는 숫자가 셀프 넘버인데
예를 들어 1의 경우 각 자릿수는 1, 본인은 1이기 때문에 2가 나오고
2는 셀프넘버의 자격을 박탈당한다.

또한 10, 100의 경우도 10+1+0, 100+1+0+0으로 각각 11, 101이 나온다.

문제를 해결하기 위해 아리스토의 체 느낌으로(곱셈 소수제거가 아니라 전혀 다르다)

1부터 1만까지의 요구 범위를 모두 확인한 다음
해당 숫자로 나오는 값들을 제거하는 방식으로 진행했다.

제거된 숫자는 0으로 변경한 다음
filter로 0을 제거해 출력하는 방식으로 문제를 해결할 수 있었다.

//input이 없는 문제
const result = [0]

const selfNumChecker = (num) => {
    let sum = num
    while(num !== 0){
        sum += num % 10
        num = Math.floor(num/10)
    }
    return sum
}
for(let i = 1 ; i <= 10000 ; i++){
    result.push(i)
}
for(let i = 1 ; i <= 10000 ; i++){
    let madeByThis = selfNumChecker(i)
    if(madeByThis <= 10000){
        result[madeByThis] = 0
    }
}



console.log(result.filter(el => el !== 0).join('\n'))