분류 전체보기
-
[코어 자바스크립트] 기타Javascript 2024. 2. 29. 17:57
Proxy와 Reflect Proxy : 객체의 기본 동작을 가로채서 수정하거나 확장할 수 있는 강력한 기능. let numbers = [0, 1, 2]; numbers = new Proxy(numbers, { get(target, prop) { if (prop in target) { return target[prop]; } else { return 0; // 기본값 } } }); alert( numbers[1] ); // 1 alert( numbers[123] ); // 0 (해당하는 요소가 배열에 없으므로 0이 반환됨) 👆🏻 위 코드처럼 get Proxy를 사용하면 '기본' 값 설정 로직을 원하는 대로 구현할 수 있다. (Proxy로 감싸기 전에는 undefined 가 나옴. undefined 값 말..
-
모듈Javascript 2024. 2. 28. 19:21
모듈은 하나의 파일입니다. 모듈은 자신만의 스코프(유효범위)가 있기 때문에 import, export 으로 기능 공유를 하지 않는 경우에는 다른 스크립트에서 접근할 수 없습니다. 항상 엄격모드로 실행됩니다. 모듈(파일) 내의 코드는 단 한 번만 실행되며 모든 모듈은 서로 공유됩니다. 브라우저에서 import, export와 같은 지시자를 사용하려면 같은 속성이 필요합니다. 지연 실행됩니다 : HTML 화면이, 문서가 완전히 만들어진 이후에 실행됩니다. 인라인 모듈 스크립트도 비동기 처리가 가능합니다. 외부 오리진에서 스크립트를 불러오려면 CORS 헤더가 있어야합니다. (CORS 헤더란? -> 다른 도메인에 있는 리소스에 대한 액세스 권한을 제어하기 위한 메커니즘, 보안정책, HTTP헤더의 일종) 중복된 ..
-
제너레이터Javascript 2024. 2. 28. 17:29
제너레이터 함수 값이 아닌 객체를 반환하는 함수 function* 이렇게 function 옆에 * 를 붙여서 사용 한다. for..of를 사용해서 모든 값이 출력되길 원한다면 마지막 반환 값을 return 이 아닌 yield로 반환해야한다. 이터러블 객체 대신 제너레이터를 사용 할 수 있다. 이터레이터를 쉽게 구현하기 위해서 제너레이터가 만들어짐. 제너레이터 컴포지션 제너레이터 안에 yield*를 사용해서 다른 제너레이터를 넣을 수 있게 해주는 기능이다. yield를 사용해 제너레이터 안, 밖으로 정보 교환하기 yield*을 사용해야지만 객체가 아닌 값을 반환해줌 async 이터레이터와 제너레이터 우선 iterable 객체라는건 반복 가능한 배열을 일반화한 객체이다. -> for..of 반복문을 적용할 ..
-
[React] npm audit fix --force 되돌리기개발 에러 2024. 2. 20. 18:51
에러 해결하는 과정 중에 터미널에서 npm audit fix --force 이걸 실행하라는 문장으로 보고 바로 실행.. 이전까지 작업해왔던 페이지가 사라지는것을 경험.. 바로 구글 검색.. 터미널에 아래 명령어들 입력.. 1. git restore package-lock.json 2. git restore package.json 3. npm install https://velog.io/@cherry_/React-npm-audit-fix-force-%EB%90%98%EB%8F%8C%EB%A6%AC%EA%B8%B0 [React] npm audit fix --force 되돌리기 아무 생각없이 뜨길래 실행했다가 진짜 죽을 뻔했다.하자마자 에러가 뜨면서 내 페이지가 안 나오는 거 ㅠㅠㅠㅠㅠㅠㅠ velog.io
-
프라미스와 async, awaitJavascript 2024. 2. 16. 15:48
* try...catch 구문과 Promise는 다른 접근 방식입니다. -> try...catch 구문은 동기 코드에서 예외를 처리하는 데 사용. -> Promise는 주로 비동기 코드에서 사용됨. 비동기 작업이 완료되었을 때나 실패했을 때 처리를 할 수 있도록 함. 콜백 콜백함수 : 나중에 호출할 함수 비동기(asynchronous) 동작을 스케줄링 할 수 있다 -> 원하는 때에 동작이 시작하도록 할 수 있다는 뜻. 콜백 속 콜백 순차적으로 스크립트를 불러오고 싶을 때 : 콜백 함수 안에서 두번째 함수를 호출하기 에러 핸들링 에러를 먼저 처리하는 방식이 흔히 사용됨(오류 우선 콜백) 콜백 지옥 콜백이 밑으로 계속 쌓이는것 (당연히 좋지 않다) -> 각 동작을 독립적인 함수로 만들어서 사용해야한다. 프라..
-
클래스Javascript 2024. 2. 13. 18:40
클래스 함수의 한 종류 클래스 안에 들어가는 값들은 프로퍼티라고 부름 인스턴스 만들어서 '인스턴스이름.메서드()' -> 이렇게 호출하면 객체가 생성됨. 순수 함수로 클래스 역할을 하는 함수를 선언하는 방법과 class 키워드를 사용하는 방법의 차이점 -> 내부 프로퍼티인 [[IsClassConstructor]]: true가 이름표처럼 붙습니다. -> 클래스에 정의된 메서드는 열거할 수 없습니다(non-enumerable). -> 항상 엄격모드로 실행됨 losing this - 함수 바인딩에서도 나옴 해결책: setTimeout(() => button.click(), 1000) 같이 래퍼 함수를 전달하기 생성자 안 등에서 메서드를 객체에 바인딩하기 coustructor - 생성자 클래스 객체의 초기화: 생..
-
[Mac] Homebrew - zsh: command not found: brew 경로 설정 오류개발 에러 2023. 10. 21. 18:50
맥에서 zsh: command not found: brew 에러를 만났을 때 1. 터미널에 vi ~/.zshrc 입력 2. # Path to your oh-my-zsh installation. 여기 아래에 기존 경로를 지우고 -> export PATH=/opt/homebrew/bin:$PATH 이렇게 입력 (* i를 누르면 수정할 수 있게끔 바뀐다.) 3. 수정 후 ESC누르면 수정이 끝나고 4. 저장 후 종료는 :wq(콜론까지 붙여주는거) 5. 터미널이나 vscode 한 번 껐다키면 brew 잘 찾는다. 끝.