Javascript/Clean Code Series(클린코드)
-
enum은 상수 값으로 이루어져 있는 집합이라고 볼 수 있습니다. Typescript에서는 enum을 지원하지만 javascript에서는 지원하지 않습니다. enum MagicianSkills { fireball = '불로 이뤄진 구체를 날림', iceball = '얼음으로 이뤄진 구체를 날림', thunderball = '번개로 이뤄진 구체를 날림', } const useSkill: MagicianSkills = MagicianSkills.fireball console.log('useSkill : ', useSkill); // 결과 useSkill : 불로 이뤄진 구체를 날림 위의 코드를 자바스크립트로 표현을 하려면 객체를 이용하여 구현해야 합니다. python처럼 다른 언어들중에는 enum을 지원하지..
(JS)Clean Code Series4 - Enums vs Dictionaries#열거형과 사전enum은 상수 값으로 이루어져 있는 집합이라고 볼 수 있습니다. Typescript에서는 enum을 지원하지만 javascript에서는 지원하지 않습니다. enum MagicianSkills { fireball = '불로 이뤄진 구체를 날림', iceball = '얼음으로 이뤄진 구체를 날림', thunderball = '번개로 이뤄진 구체를 날림', } const useSkill: MagicianSkills = MagicianSkills.fireball console.log('useSkill : ', useSkill); // 결과 useSkill : 불로 이뤄진 구체를 날림 위의 코드를 자바스크립트로 표현을 하려면 객체를 이용하여 구현해야 합니다. python처럼 다른 언어들중에는 enum을 지원하지..
2021.08.29 -
보통 콜백 함수로 익명함수를 자주 많이 씁니다. .reduce(), .map(), .foreach()... 등 안에 () => {} 익명의 함수를 콜백 함수로 넣습니다. 편하고 필요할때 적시 적소에 쓰이기 때문에 매우 유용합니다. 예를들어 객체 배열 안에 든 값을 map으로 아래처럼 가공하여 보여줄 수 있습니다. interface IGoblin { name: string hp: number attack: number } const goblins: Array = [ { name: 'goblin warrior', hp: 200, attack: 30 }, { name: 'goblin archer', hp: 120, attack: 40 }, { name: 'goblin magicion', hp: 100, att..
(JS)클린 코드 시리즈3 - Named Callback Function #명명된 콜백 함수보통 콜백 함수로 익명함수를 자주 많이 씁니다. .reduce(), .map(), .foreach()... 등 안에 () => {} 익명의 함수를 콜백 함수로 넣습니다. 편하고 필요할때 적시 적소에 쓰이기 때문에 매우 유용합니다. 예를들어 객체 배열 안에 든 값을 map으로 아래처럼 가공하여 보여줄 수 있습니다. interface IGoblin { name: string hp: number attack: number } const goblins: Array = [ { name: 'goblin warrior', hp: 200, attack: 30 }, { name: 'goblin archer', hp: 120, attack: 40 }, { name: 'goblin magicion', hp: 100, att..
2021.08.22 -
실제로 코딩하다보면 null 혹은 undefind를 참조하여 에러가 뜨는 경우가 많습니다. 초보인 분들은 에러 메세지를 검색해서 해결할 수도 있고 어느정도 경험이 있으신분들은 아 null 방지를 안해줬구나하고 바로 AND(&&)문 아니면 옵셔널 체이닝으로 해결할 수도 있습니다. 하지만 &&(AND)문이나 ?.(Optional Chaining)은 참조할 값이 null이면 그냥 아무것도 안들어오게 됩니다. 만약 참조할 값이 null인지 체크하고 참조할값이 있다면 참조값을 쓰고 아니라면 다른 default값을 넣어주고 싶을때 보통 삼항 연산자를 많이 쓰지요. potion ? 'drink' : 'do nothing' 하지만 널 병합 연산자로 더 간편하게 쓸 수도 있습니다. let skeletonSoldier =..
(JS)클린 코드 시리즈2 - Nullish coalescing operator #?? #널 병합 연산자실제로 코딩하다보면 null 혹은 undefind를 참조하여 에러가 뜨는 경우가 많습니다. 초보인 분들은 에러 메세지를 검색해서 해결할 수도 있고 어느정도 경험이 있으신분들은 아 null 방지를 안해줬구나하고 바로 AND(&&)문 아니면 옵셔널 체이닝으로 해결할 수도 있습니다. 하지만 &&(AND)문이나 ?.(Optional Chaining)은 참조할 값이 null이면 그냥 아무것도 안들어오게 됩니다. 만약 참조할 값이 null인지 체크하고 참조할값이 있다면 참조값을 쓰고 아니라면 다른 default값을 넣어주고 싶을때 보통 삼항 연산자를 많이 쓰지요. potion ? 'drink' : 'do nothing' 하지만 널 병합 연산자로 더 간편하게 쓸 수도 있습니다. let skeletonSoldier =..
2021.08.13 -
개발할때 보통 api에서 데이터를 가져온 후 Object 형식의 useState에서 setState로 데이터를 넣어준 후 보통 아래처럼 데이터를 사용합니다. let fireball = user.skill.fireball; or ({user.skill.fireball}) 근데 만약 여기서 user.skill이 null이라면 "Uncaught TypeError: Cannot read property 'fireball' of null" 이런 문구의 에러가 발생합니다. 여기서 만약 optional chaining을 모른다면 let fireball = user.skill && user.skill.fireball; or ({user.skill && user.skill.fireball}) user.skill.fire..
(JS)클린 코드 시리즈1 - Optional Chaining #?. #옵셔널 체이닝개발할때 보통 api에서 데이터를 가져온 후 Object 형식의 useState에서 setState로 데이터를 넣어준 후 보통 아래처럼 데이터를 사용합니다. let fireball = user.skill.fireball; or ({user.skill.fireball}) 근데 만약 여기서 user.skill이 null이라면 "Uncaught TypeError: Cannot read property 'fireball' of null" 이런 문구의 에러가 발생합니다. 여기서 만약 optional chaining을 모른다면 let fireball = user.skill && user.skill.fireball; or ({user.skill && user.skill.fireball}) user.skill.fire..
2021.08.08