IT/javascript9 [JS] var 에 대해서 그리고 hoisting 까지 var변수 선언할 때 사용새로운 코드를 작성할 땐 사용하면 안됨 - let 또는 const만 사용 - 이유는 블록 scope가 없기 때문 (**매우 중요) - 그래서 var로 작성된걸 let 또는 const로 변경하는 작업을 한다면 스코프에 유의해야한다.블록 scope가 아닌 함수 수준 scope를 갖는다.var 선언은 함수가 시작되는 시점에 처리 된다.scope 무시되는 예제예제 1) if statement scope가 무시됨if (true) { var test = true;}alert(test); // alert의 값이 true로 찍힘 예제 2) for loop에서도 scope이 무시됨for (var i = 0; i 예제 3) 함수 안의 scope 무시됨function sayHi() { if (.. 2024. 9. 12. [javascript] import 자세하게 파해쳐보자 퀴즈 하나 내본다. 맞춰봐라. 상품은 없다. 두개의 파일이 있다고 해보자hello.tsclass Greeting { say() { const a = Math.random() * 0.3; return `hello ${a}`; }}export const hello = new Greeting(); index.tsimport { hello } from "./hello";const d = hello;const e = hello;console.log(d === e); index.ts에서 console에 찍히는 값은 무엇일까?답은 true이다. 왜 true인지 파해쳐 보려 한다. code 실행 시 import statement가 hoisted 된다. 이 말은 코드가 돌기 전에 먼저 다뤄진다는 말이다.처.. 2024. 9. 12. [JS] 제너레이터 함수 (generator function) 개념함수의 실행을 중단하고 재개할 수 있는 특별한 유형의 함수`function*` 키워드로 정의되고, 내부에서 `yield` 키워드를 사용하여 값을 반환하고 함수의 실행을 일시 중지할 수 있다. function* simpleGenerator() { yield 1; yield 2; yield 3;}const gen = simpleGenerator();console.log(gen.next()); // { value: 1, done: false }console.log(gen.next()); // { value: 2, done: false }console.log(gen.next()); // { value: 3, done: false }console.log(gen.next()); // { valu.. 2024. 7. 7. [JS] prototype 코딩애플 - 이거보고 prototype 이해 못하면 강의접음 영상을 보고 요점만 정리한 글입니다. 개념부모로 받은 유전자라고 생각하는 것이 편하다.내가 직접 선언하지 않았지만, 부모로 부터 물려받아 사용이 가능하다. 코드객체를 생성하여 prop을 확인해보니 mouse와 eye는 존재하지만 handsome은 존재하지 않는다.하지만 handsome을 선언하면 유전자(prototype)를 검사하여 존재 여부를 판단한다.function human() { this.mouse= 1, this.eye = 2}human.prototype.handsome = '50%'const a = new human()console.log(a) // human: { "mouse": 1, "eye": 2 } console... 2024. 4. 30. [JS] if else 리팩토링 (중첩 조건문 처리하기) > 코드 변환 스냅샷 아래의 스크린샷은 Youtube 영상에서 리팩토링 과정을 단계별로 스냅샷을 찍어놨습니다.추후 비슷한 상황에서 최대한 빠르게 리마인드하고 적용해보려 합니다.이 글을 본다고 이해되진 않습니다. 위의 링크를 꼭 시청하시길 바랍니다. 지극히 시청한 사람을 위한 글입니다. 초기 버전 단계 1: 객체로 변환 단계2: move에 Parameter를 추가하여 select와 Parameter 규격을 맞춘다. 단계3: 규격에 맞는 파라미터 값들만 남기고 배열로 감싼다. 단계4: ArrowUp과 Down은 부호만 다르니 더욱더 추상화가 가능 단계 5: 코드를 보니 direction 값을 굳이 객체에서 안가져와도 되네? 최종: 코드를 보니 객체가 필요가 없네? 2024. 4. 29. [JS] if else 리펙토링 (객체 + 함수) 아래 Youtube 영상의 내용을 거의 그대로 가져온 페이지입니다.문제가 될 경우 삭제하겠습니다. 결론if else가 중복되면 switch case로 변경해보자.나름의 규칙성을 발견하기 쉬워진다.규칙을 발견하면 이를 바탕으로 객체로 추출 가능하다 객체를 함수 외부로 분리하면 공통로직 / 분기별 실제 동작 정의가 분리되어 읽기도 수월해지고, 수정사항이 생겨도 공통로직은 건드리지 않아도 되어 편리하다. 리펙토링할 소재를 발견할 수 있고, 소재가 발견되지 않더라도 객체형태로 전환한 그 자체로 이미 꽤 깔끔하다 분기가 함수일 경우 구조 분해 할당 (destructured assignment)을 이용해 상황별 필요한 데이터 파악이 한결 용이해짐 # if else 로직const naverLogin = (id) =.. 2024. 4. 29. 이전 1 2 다음
