Study/JavaScript(Clean code)

[JavaScript][clean-code] 매개변수의 순서가 경계이다.

* 매개변수의 순서가 경계다. 매개변수의 순서만 잘지켜도 그것 자체가 경계이다. 호출하는 함수의 네이밍과 인자의 순서의 연관성을 고려한다. 다양한 관계들을 함수의 네이밍과 인자를 통해서 역할을 유추할 수 있다. 함수를 만들때 함수의 네이밍과 인자를 고려해준다. getRandomNumber(1, 50); getDates('2021-10-01', '2021-10-31'); getShuffleArray(1, 5); * 유지보수에 취약한 함수를 만들지 않기 위해서는 매개변수를 2개가 넘지 않도록한다. 그런데도 인자가 너무 많을거 같으면 arguments, rest parameter를 이용한다. 혹은 매개변수를 객체에 담아서 넘긴다. 객체이므로 순서가 상관없으므로 다양하게 인자를 다룰수 있다. 아래의 예시 참조 ..

[JavaScript][clean-code] prefix-suffix

* prefix(접두사) - suffix(접미사) prefix와 suffix를 이용해서 다양한 네이밍의 규칙을 만들어 줄 수 있다. 일관성을 가질 수 있는 가장 좋은 방법중 하나이다. * prefix(접두사)가 사용되는 경우 React에 use- 가 붙은 파일이름 혹은 네이밍은 Hook이다.(관습, 약속) React-use라는 파생 라이브러리도 있다. JavaScript의 getter, setter JQuery의 prefix는 $ 이다. - prefix가 다양하게 사용된다. (일종의 약속) * suffix(접미사)가 사용되는 경우 suffix를 사용해서 네트워크 상태를 접미사로 보여주는 예시 const START_REQUEST = 'START_REQUEST' (요청) const START_SUCCESS ..

[JavaScript][clean-code] first-last

* 만약 숫자의 연속성이 없고 규칙성이 없다면??? - first와 last를 고려해야한다. * first와 last 양끝점이 존재하나 안에 있는 요소에 대한 규칙이나 연속성에 대해서는 보장이 되지 않는경우 이런 경우 first, last를 이용하면 된다. * 예시코드 const students = ['hyeonwoo', 'latte', 'poodle'] function getStudents(first, last) { // ...some code } getStudents('hyeonwoo', 'poodle') * HTML요소도 생각해볼 수 있다. DOM요소에도 firstChild, lastChild라는 DOM Api가 있다.

[JavaScript][clean-code] min - max & begin - end

* min - max 최소값과 최대값을 다룬다. 최소값과 최대값의 포함여부를 항상 결정해야한다. (초과 ~ 미만 / 이상 ~ 이하) 혹은 네이밍에 최소값과 최대값 포함 여부를 표현해야한다. 코드를 작성할 때 명시적인 코드를 작성할 수 있다. * 예시 함수를 통해서 min, max에 대해서 확인 및 판단 해보기 function getRandomNumber(min, max) { return Math.floor(Math.random() * (max - min + 1)) + min; } // 상수 const MIN_NUMBER =1; const MAX_NUMBER =45; // 상수만 할당 해주어 함수를 실행 getRandomNumber(MIN_NUMBER, MAX_NUMBER); 최소값과 최대값에 대한 값을 ..

[JavaScript][clean-code] isNaN (is Not a Number)

컴퓨터는 기본적으로 2진수를 가지고 있다. 사람이 생각하는 숫자는 10진수이다. 따라서 이러한 간극 때문에 숫자를 다루기 어렵다. 특히 소수점에서 간극이 많이 생긴다. 이러한 간극을 자바스크립트는 IEEE754 표준을 사용하여서 부동소수점을 표현을 표준을 이용해 해결하려고 한다. * isNaN (is Not a Number) (Bad) - 숫자가 아니다. - typeof를 이용하다가 isNaN을 통해서 숫자를 확인할 경우가 있다. isNaN : true // 숫자가 아니다. isNaN : false // 숫자가 맞다. (숫자가 아닌게 아니다) isNaN(123) // false isNaN은 느슨한 검사를 한다. 따라서 엄격한 검사를 해주어야한다. * Number.isNaN (Good) - 엄격한 검사를 ..

[JavaScript][clean-code] undefined & null

* undefined & null - 둘다 값으로 쓰기에는 무언가 없다를 의미한다. * undefined 선언했지만 값은 정의되지 않고 할당이 되지 않은 상태 아무것도 지정하지 않을때 기본값 let a; console.log(a); // undefined typeof a; // 'undefined' undefined + 10 // NaN !undefined // true undefined == null // true undefined === null // false !undefined === !null // true * null !null // true !!null // false null === flase // false !null === true // true // null은 수학적으로는 0으로 취급..