본문 바로가기

IT/javascript11

[javascript] import 방식 (named, default) export는 default와 named로 나눌 수 있고, export 방식에 따라 import도 다르게 해야한다. // some-lib.tsexport default function greet() { console.log('Hello');}export function say() { console.log('hello world')} default export 만 불러오는 방법// main.tsimport someLib from './some-lib'; // ✅ someLib는 greet 함수someLib(); // Hello named export 만 불러오는 방법// main.tsimport { say } from './some-lib'; // ✅ someLib는 greet 함수say(); // h.. 2025. 7. 10.
[javascript] react 개발자. bind, apply, call 꼭 알아야 하나? 이걸 왜 배워야하지? 가끔 피드에 bind, apply, call에 대한 컨텐츠가 나온다. 그럼 어? 옛날에 공부했던건데 지금 기억이 안나네.. 이거 현업에서도 쓰이지 않는거 같은데 왜 내가 이걸 배웠었는지 이걸 꼭 알아야 하는지 의문이 들었다. 그래서 이 글로 인하여 내 궁금증을 해소해보려 한다. jQuery로 웹서비스를 만들 때 몇 번 bind를 이용해서 작성된 코드를 본적이 있다. 하지만 react로 몇 년동안은 bind, apply, call은 써본적도 없고 누가 작성한 코드를 본적도 없는거 같다. bind, apply, call에 대해 간단히 살펴 보고 jQuery를 사용할 때는 왜 사용했었는지, 지금은 왜 사용안하는지, 여전히 알 필요가 있는지 알아보자. 기본 개념bind, call, apply는 함수의 this를.. 2025. 5. 1.
[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.

티스토리툴바