heyday2024 님의 블로그

1. 콜백지옥콜백함수를 익명함수로 전달하는 과정이 반복되어 코드의 들여쓰기 수준이 헬인 경우!( 주로 이벤트 처리 및 서버 통신과 같은 비동기적 작업을 수행할 때 발생 ) ----> 가독성이 정말 지옥(hell)임. 2. 동기 vs 비동기  위에 카페는 진동벨 없이 주문요청이 들어오면 작업을 끝낼 때 까지 손님들이 기다림(시간 오래걸림)그리고, 뒤에 손님들은 무조건 자신의 바로 앞의 주문이 완료되어야만 주문 요청을 할 수 있음.-----> 동기 아래에 카페는 손님들에게 주문 요청을 다 받고, 진동벨을 나눠준 후 작업이 끝나는 대로 그 진동벨을 울려서 작업을 완료함. (시간적으로 효율적임) ----> 비동기 동기 : synchronous현재 실행중인 코드가 끝나야 다음 코드를 실행하는 방식을 말해요!CPU..

10장: 객체 리터럴자바스크립트는 객체 기반의 프로그래밍 언어객체: 원시값을 제외한 나머지(함수, 배열, 정규 표현식 등) 값은 모두 객체. 원시타입 vs 객체 타입 원시타입은 단 하나의 값만 나타내지만,  객체 타입(object/reference type)은 다양한 타입의 값을 하나의 단위로 구성한 복합적인 자료구조(data structure)임 원시타입의 값은 변경 불가능한 값(immutable value)이지만,객체타입의 값, 즉 객체는 변경 가능한 값(mutable value)임  객체는 0개 이상의 property(속성)로 구성된 집합,property는 key 와 value로 구성됨property의 key는 일반적으로 문자열 사용(symbol도 사용가능 그러나 많이 안쓰임)식별자 네이밍 규칙(카..

콜백함수// setTimeoutsetTimeout(function() { console.log("Hello, world!");}, 1000);// forEachconst numbers = [1, 2, 3, 4, 5];numbers.forEach(function(number) { console.log(number);});setTimeout, forEach를 보면 둘다 function을 인자로 받는다. 이 인자로 넘겨진 함수들을 콜백함수라고 함. 다른 코드의 인자로 넘겨주는 함수! 인자로 넘겨준다는 얘기는 콜백함수를 넘겨받는 코드가 있다는 뜻 (like forEach, setTimeout 등).콜백 함수를 넘겨받은 위와 같은 코드 forEach, setTimeout 등은 이 콜백 함수를 필요에 따라 적절..

6장: 데이터 타입저번 시간에 끝까지 읽지 못해서 간략하게 정리. 원시타입: number, string, boolean, undefined, null, symbol객체 타입: object, function, array  \'작은따옴표 (')\"큰따옴표 (")\\백슬래시 ()\n줄 바꿈 (Newline)\r캐리지 리턴 (Carriage Return): 커서를 처음으로 이동.\t수평 탭 (Tab)\b백스페이스 (Backspace)\f폼 피드 (Form Feed)\v수직 탭 (Vertical Tab)\0널 문자 (Null Character)\uXXXX유니코드 문자, XXXX는 4자리 16진수, 예시로 '\u0041'은 'A'\xXX16진수 ASCII 문자, XX는 2자리 16진수 새로운 문자열 표기법: 백틱(..

가장 아래의 코드가 실행 되었을 때, “Passed ~” 가 출력되도록 getAge 함수를 채워주세요 var user = { name: "john", age: 20,};var getAged = function (user, passedTime) { // 여기를 작성해 주세요! // 깊은 복사 방식을 선택할까했지만, user라는 객체는 depth 가 1인 for loop로도 충분히 복사가 되고, // 상황에 맞는 얕은 복사 이용이 깊은복사보다 성능이 좋기 떄문에 나는 얕은 복사를 해볼 것이다. let newUser = { ...user }; newUser.age += passedTime; return newUser; // let newUser = {}; // for (let property..

- 실행 컨텍스트는 실행할 코드에 제공할 환경 정보들을 모아놓은 객체이다.- 그 객체 안에는 3가지가 존재한다.✓ VariableEnvironment ✓ LexicalEnvironment ✓ ThisBindings객체 지향 언어에서의 this = 클래스로 생성한 인스턴스자바스크립트에서는 this가 어디에서나 사용될 수 있음!!! this는 실행 컨텍스트가 생성될 때 결정됨(this를 bind한다(=묶는다)) 다시 말하면. this는 함수를 호출할 때 결정된다.   상황에 따라 달라지는 this: 1. 전역 공간에서의 this전역 공간에서 this는 전역 객체를 가리켜요.런타임 환경에 따라 this는 window(브라우저 환경) 또는 global(node.js 환경)를 각각 가리킵니다. 런타임 환경? ja..

APIApplication Programming Interfaces 약자서로 다른 시스템이 서로 소통할 수 있는 방법 또는 창구일종의 메뉴판 역할. ex) 손님(client)이 키오스크를 통해서 메뉴를 주문(요청)하면 식당(server)이 주문한 메뉴를 조리해서 손님에게 가져옵니다(응답).DOMDocument Object Model 의 약자웹 페이지 문서를 구성하는 요소들을 트리(Tree) 구조로 표현한 객체브라우저에서 HTML 문서를 자바스크립트로 제어할 수 있게 해주는 인터페이스BOMBrowser Object Model 의 약자문서 이외의 모든 것을 제어하기 위해 제공하는 추가 객체Event브라우저에서 사용자가 웹 페이지와 상호작용할 때 발생하는 사건다양한 종류의 Event가 있음 ex) click,..

브랜치(== 복사본): 보통 기능 추가 코드 짤 때 브랜치 만들어 사용git branch 브랜치이름 브랜치 이동 명령어git switch 브랜치이름  예전에는  브랜치 이동할 때 checkout 썼음...git checkout 브랜치 이름  여기서 login 브랜치가 최신인데 main으로 합치는 이유:협업 시 여러 사람들이 코드를 한곳에 합쳐야되기 떄문에.... 최종 브랜치로 이동을 하고 git merge 브랜치명 (위 예시에서는 git merge login) 근데 보통 github 에서 합치는 게 더욱 선호됨 : 터미널에서 직접 커밋하고 병합하는 것보다 협업과 코드 품질 관리를 체계적으로 할 수 있기 때문   코드 리뷰: PR을 통해 팀원들이 코드 변경 사항을 검토하고 피드백을 줄 수 있습니다. 터미널..

콜백 함수다른 함수에 인자로 전달되어 나중에 호출되는 함수sort(), map() 등의 배열 메소드에서 인자로 자주 사용됩니다.변경 메소드 / 비변경 메소드변경 메서드(Mutable Method): 배열 원본 자체를 변경하는 메서드비변경 메서드(Immutable Method): 배열 원본을 변경하지 않고, 새로운 배열을 반환하는 메서드참조형 타입이란?참조형 타입은 메모리에 값이 저장된 주소를 참조하는 타입(객체, 배열, 함수...) 참조형 타입은 값을 직접 가지지 않고, 해당 값이 저장된 메모리 주소를 가리킴.따라서, 같은 참조형 타입 변수를 여러 개 만들면 모두 동일한 메모리 주소를 가리키기 때문에 한 변수를 수정하면 다른 변수에도 영향을 미칠 수 있음. (참조 복사: const obj2 = obj1)..

실행 컨텍스트(Execution Context): 자바스크립트의 실행 컨텍스트는 실행할 코드에 제공할 환경정보들을 모아놓은 객체 자바스크립트는 어떤 실행 컨텍스트가 활성화되는 시점에 크게 3가지의 일을 함.선언된 변수를 위로 끌어올림: 호이스팅(Hoisting)외부 환경 정보 구성(lexical environment)this 값 설정--> 이런 특징들이 JS가 다른 언어와 다르다는 것을 보여줌. 호이스팅: 자바스크립트만의 독특한 개념으로, 다른 언어에서는 일반적으로 지원되지 X외부 환경 정보 구성: 자바스크립트와 비슷한 방식으로 파이썬, Java(람다식), 일부 스크립트 언어들도 클로저 및 렉시컬 스코프를 지원함this 설정: 자바스크립트는 매우 유연하게 this를 설정하는 반면, 다른 객체지향 언어들(..