하다보니

TypeScript 공식 문서를 보던 중 if (1 < x < 3) { // *어떤* x 값이던 참입니다! } 라는 코드를 보게 되었다. 해당 예시는 JavaScript 의 동일 연산자는 (==) 인수를 강제로 변환하여(coerces), 예기치 않은 동작을 유발한다라는 설명의 예시였다. 나는 왜 1

실행 컨텍스트는 학습하기에 구성이 꽤 복잡한데다 순전히 자바스크립트 스펙을 위한 메커니즘이기 때문에 직접 접근해서 확인하기가 어렵다. 실행 컨텍스트 안에 있는 record, outer 를 중점적으로 살펴보겠다. 1. record로 js 호이스팅 이해하기 선언 라인 전에도 에러가 나지 않고 변수를 참조할 수 있는 현상을 선언문이 마치 최상단에 끌어 올려진듯 하다고 해서 호이스팅 현상이라고 한다. 물리적으로 최상단에 끌어 올려졌기 때문이 아니라 자바스크립트 엔진이 전체 코드를 스캔하면서 변수같은 정보를 실행 컨텍스트 어딘가에 미리 기록해뒀기 때문이다. 이때 기록해두는 곳이 record이다. 정식 명칭은 environment record로 식별자와 식별자에 바인딩된 값을 기록해두는 객체이다. 이 환경 레코드에..

https://paperblock.tistory.com/62

.sort() 만으로는 정렬이 안 되는 걸까? 안된다. 그 이유는 자바스크립트의 sort 함수는 기본적으로 배열을 문자열 타입으로 간주하고 비교하기 때문이다. [b,a,c]라는 배열에 .sort() 를 적용하면 [a,b,c]로 맞게 정렬을 해주는데 숫자 [90,100,110]은 "90","100","110"으로 간주되어 "90"과 "100"을 비교시 앞자리 9와 1을 비교하여 100보타 90이 더 크다는 결론을 내린다. 이러한 이유로 숫자를 비교하기 위해선 별도로 정의된 compare function을 이용해야 한다. sort 함수는 인자로 compare function을 받는다. 즉, 인자의 자리에 함수가 위치한다. sort 알고리즘은 2개의 배열 인자를 뺄셈 연산을 이용하여, 뺀 값이 양수이면 2개의..

async와 await는 promise를 좀 더 간결하고 간편하고 동기적으로 실행되는 것처럼 보이게 만들어 주는 것. promise를 chining을 계속 할 수 있는데 코드가 난잡해질 수 있다. 기존에 존재하는 promise에 좀 더 간편한 api로 async와 await를 사용하면 코드를 동기식으로 작성하는 것처럼 간편한 작성을 도와준다. 새로운 것이 추가된 것이 아닌 기존에 존재하는 기능에 좀 더 간편한 api를 제공한다. 이렇게 기존에 존재하는 것 위에 기존에 존재하는 것을 감싸서 우리가 좀 더 간편하게 쓸 수 있는 api를 제공하는 것을 syntactic sugar이라 한다. 자바 스크립트에서 class는 완전히 새로운 것이 아니라 프로토타입을 베이스로 한 syntactic sugar이다. as..

promise - 자바스크립트에서 제공하는 비동기를 간편하게 처리할 수 있도록 도와주는 오브젝트이다. promise는 정해진 장시간의 기능을 수행하고 나서 정상적으로 기능이 수행되어졌다면 성공 메세지와 함께 처리된 결과값을 전달해준다. 에러가 나면 에러를 전달. promise는 자바 스크립트 안에 내장되어 있는 오브젝트 이다. 비동기적인 작업을 수행할 때 콜백함수 대신에 유용하게 사용할 수 있는 오브젝트이다. state : 프로세스가 heavy한 operation을 수행하고 있는 중인지 기능 수행을 완료한 후 성공인지 실패인지 상태에 대해 이해하는 것이 중요하다. operation이 수행 중일 때는 pending상태이고 이것을 성공적이게 끝내게 되면 fulfilled state가 된다. 만약 파일을 찾을..

자바스크립트는 동기적인 언어이다. 한 작업이 실행되는 동안 다른 작업은 멈춘 상태를 유지하고 자신의 차례를 기다리는 것을 말한다. hoisting이 된 이후로부터 작성한 순서대로 나씩 실행된다는 말이다. Memory heap과 call stack은 자바스크립트 엔진의 주요 구성 요소이다. memory heap이란? - 변수와 객체의 메모리 할당을 담당하는 곳을 말한다. call stack이란? - 함수가 호출되면 쌓이는 것이다. 대신 함수가 쌓이는 순서와 반대로 실행된다. 자바스크립트의 비동기 처리 작동원리는 여기를 참고해라. https://ljtaek2.tistory.com/142 asynchronous는 비동기적으로 언제 코드가 실행될지 모르는 것이다. 어떠한 요청을 보내면 그 요청이 끝날 때까지 기..

브라우저 위에서 동작하는 웹사이트나 웹 어플리케이션같은 클라이언트들이 서버와 어떻게 통신할 수 있는지 정의한 것이 http이다. http는 hypertext transfer protocol의 약자이다. 어떻게 이 hypertext를 주고받을 수 있는지를 규약 한 프로토콜의 하나. 클라이언트가 서버에 request를 하면 서버가 response를 보내주는 방식이다. hypertext는 하이퍼링크 뿐 아니라 전반적으로 쓰이는 문서나 이미지 파일들 모두 포함한다. 이렇게 http를 이용해서 서버에서 데이터를 받아올 수 있는 방법으로는 AJAX를 썼다. AJAX는 asynchronous javascript and xml의 약자이다. ajax는 웹페이지에서 동적으로 서버에게 데이터를 주고 받을 수 있는 기술을 의..

// Q1. make a string out of an array { const fruits = ["apple", "banana", "orange"]; //구분자가 있어도 되고 없어도 된다.기본은 ,이다. //배열의 모든 item을 string으로 나타내준다. let result = fruits.join("^"); console.log(result); //apple^banana^orange } // Q2. make an array out of a string //문자열 배열로 만들기 //seperator와 limit을 인자로 받을 수 있다. //seperator는 필수, limit은 선택 { const fruits = "🍎, 🥝, 🍌, 🍒"; result = fruits.split(",", 2); con..

// Objects // one of the JavaScript's data types. // a collection of related data and/or functionality. // Nearly all objects in JavaScript are instances of Object // object = { key : value }; 키와 값의 집합체이다. //1.Literals and properties const obj1 = {}; // 'object literal' syntax const obj2 = new Object(); // 'object constructor' syntax - new로 정의하면 object에서 정의된 constructor 호출 function print(person)..