공부 및 일상기록

1999년, 자바스크립트를 이용해 서버와 브라우저가 비동기 방식으로 데이터를 교환할 수 있는 통신 기능인 Ajax (asynchronous javascript and XML) 가 XMLHttpRequest라는 이름으로 등장했다. 자바스크립트를 이용해 서버와 브라우저가 비동기 방식으로 데이터를 교환할 수 있는 통신 기능 브라우저가 가지고 있는 XMLHttpRequest 객체를 이용해서 전체 페이지를 새로 고치지 않고도 페이지의 일부만을 위한 데이터를 로드하는 기법 비동기 방식이란? 비동기 방식은 웹페이지를 리로드하지 않고 데이터를 불러오는 방식이며 Ajax를 통해서 서버에서 요청을 한 후 멈추어 있는 것이 아니라 그 프로그램은 계속 돌아간다는 의미를 내포하고 있다. 비동기 방식의 장점 페이지 리로드의 경우..

this 는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수(self referencing variable)이다. this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있다. this바인딩 this 바인딩(this에 바인딩 될 값)은 함수 호출 방식, 즉 함수가 어떻게 호출되었는지에 따라 동적으로 결정된다. 일반적으로 함수를 호출하는 방법은 다음과 같다. 일반 함수 호출 메소드 호출 생성자 함수 호출 Function.prototype.apply/call/bind 메소드에 의한 간접 호출 일반 함수 호출 기본적으로 this에는 전역 객체가 바인딩 된다. function foo() { console.log("foo's this : ", thi..

고차함수 (HOF, Higher Order Function) 고차함수란 함수를 매개변수로 사용하거나 함수를 반환하는 함수이다. 쉽게 말해 우리가 정의해서 사용하는 함수가 함수를 인자로 받아서 사용하거나 결과값이 함수라는 이야기 이다. 고차함수는 왜 사용할까? 추상화를 하기 위해 사용한다. 추상화는 곧 생산성의 향상과 같다. 프로그램을 작성할 때, 반복해서 사용하는 로직은 별도의 함수로 작성하곤 한다. 이 역시 추상화의 좋은 사례이다. 고차함수 역시 함수를 전달받거난 함수를 리턴하면서 한번 더 생각할 깊이를 낮춰주고 사용법만 익히면 복잡하게 얽힌 기능을 수행해주는 사고수준에서의 추상화를 시키는 사례이다. 추상화의 수준이 높아지는 만큼 생산성도 비약적으로 상승하게 된다. 우리가 자주 사용했던 고차함수 자바스..

passed by value 인자로 넘기는 값을 복사해서 새로운 함수에 전달하는 방식 값에 의한 호출은 원본값이 변경될 가능성은 없지만, 고비용과 메모리의 문제점이 있다. let a = 1; let b = a; console.log(a, b) // 1 1 console.log(a===b) //true a=10; console.log(a,b) //10 1 변수 a는 원시타입인 숫자 1을 할당했고, 원시타입은 불변성이 유지되어 b에 a를 할당하면 새로운 메모리에 1이 저장된다. passed by reference 주소값을 인자로 전달하는 방식 참조에 의한 호출은 원본값의 변경이 일어날 수도 있다는 문제점이 있다. const obj = { a: "apple" }; const test = obj; test.a ..

자바스크립트는 타입 변환에 유연하게 동작한다. == (equality operator) == 연산자는 두 피연산자의 값의 타입이 다를 경우 자동으로 일부 피연산자의 타입을 변환 후 값을 비교한다. 타입을 비교하지 않으므로 느슨한 비교를 한다고 표현한다. 1 == 1 //true 1 == '1' //true true == 1 //true true == '1'1 //true true == 'true' //false null == undefined //true *true=='true' 는 false이다. 불리언과 문자를 둘 다 변환 해서 1이 되어야만 true이기 때문에 이는 성립되지 않는다. === (strict equality operator) === 연산자는 타입을 변환하지 않으므로 ==연산자에 비해 엄..

화살표 함수는 함수표현식보다 단순하고 간결한 문법으로 함수를 만들 수 있는 방법이다. //함수표현식 let func = (arg1, arg2, ... argN) { return expression; } //화살표함수 let func = (arg1, arg2, ... argN) => expression 기존의 함수 표현식에서 function 키워드를 삭제하고, 인자를 받는 매개변수의 괄호와 코드블록 사이에 화살표만 넣어주면 화살표 함수이다. 그리고 함수 내부의 내용이 반환값(return)만 있다면 코드블록인 중괄호와 return을 생략할 수 있다. 또한 인자가 하나만 있다면 매개변수의 괄호도 생략 가능하고, 만약 인자가 없다면 생략이 불가능 하다. 그리고 return을 생략할 수 있는 조건에서 만약 ret..

자바스크립트는 싱글스레드를 가지고 있다. 스레드의 개념은 위와같다. 스레드가 여러개인 멀티스레드라면 한번에 많은 일을 처리할 수 있지만 자바스크립트는 싱글스레드이기 때문에 일을 순차적으로 실행해야 한다. 싱글스레드 특징 1. context switch 작업을 요구하지 않는다. 문맥교환이란 하나의 프로세스가 CPU를 사용중인 상태에서 다른 프로세스가 CPU를 사용하도록 하기 위해, 이전의 프로세스의 상태(context)를 보관하고 새로운 프로세스의 상태를 적재하는 작업 2. 자원 접근에 대한 동기화를 신경쓰지 않아도 된다. 스레드들이 동시에 동일한 자원에 접근하는 것을 막아주어야 하는데 이에 별도의 노력이 필요하지 않다. 3. 프로그래밍 난이도가 쉽고, 자원을 적게 소모한다. 4. CPU만을 사용한 연산을..

렉시컬 환경이란 자바스크립트 코드에서 변수나 함수등의 식별자를 정의하는데 사용하는 객체이다. 모든 함수, 코드블록 { }, 스크립트는 렉시컬 환경을 갖는다. 렉시컬 환경 객체는 두 파트로 나눠져 있다. 1. 환경레코드 : 모든 로컬변수( + this등의 정보들)를 property로 저장하는 객체 2. 외부 렉시컬 환경을 참조하는 포인터 : 중첩된 자바스크립트 코드에서 스코프를 탐색함