재혁의 기술블로그 재혁의 기술블로그

변수 1. 변수란 무엇인가? 왜 필요한가? 메모리 컴퓨터는 CPU를 사용해 연산하고, 메모리를 사용해 데이터를 기억한다. 각 셀은 고유의 메모리 주소를 갖는다. 메모리 공간에 직접 접근하는 것은 위험하므로 변수를 사용한다. 변수 값의 위치(값이 저장된 메모리 공간)를 가리키는 상징적인 이름 변수는 어디에 저장이 될까? 변수 이름을 비롯한 모든 식별자는 실행컨텍스트에 등록이 된다. 실행컨텍스트는 자바스크립트 엔진이 소소코드를 평가하고 실행하기 위해 필요한 환경을 제공하고 코드의 실행결과를 실제로 관리하는 영역이다. 자바스크립트 엔진은 실행 컨텍스트를 통해 식별자와 스코프를 관리한다. 변수 이름과 변수의 값은 실행컨텍스트 내에 key, value 형태의 객체로 등록되어 관리된다. 2. 식별자 어떤 값을 구별..

시작하면서 .. 먼저 웹 개발에서 이벤트 처리는 사용자와 상호작용하고 웹 어플리케이션의 동작을 제어하는 핵심 요소 중 하나이다. HTML의 계층적 구조로 인해 이벤트가 발생한 요소에서부터 상위 요소로 연쇄적으로 이벤트가 전파가 되는데 여기에는 이벤트 캡쳐링과 버블링이라는 두 개념이 존재한다. 이벤트를 흐름을 제어하는 방법과 이벤트 캡쳐링 , 버블링에 대해서 알아보겠습니다. 아래에 하나의 예시코드가 있다. 위에 핸들러는 에 할당이 되어있지만 , 태그를 클릭해도 동작을한다. 왜 그럴까? HTML 요소의 계층적 구조와 연쇄적 이벤트 흐름 HTML 문서의 각 요소들은 태그 안의 태그가 위치하는 식으로 중첩된 형태로 구성되어 있다. 이러한 계층적 구조 특징 때문에 만일 HTML 요소에 이벤트가 발생할 경우 연쇄적..

1. forEach() forEach()는 주어진 callback을 배열에 있는 각 요소에 대해 오름차순으로 한 번씩 실행합니다. 삭제했거나 초기화하지 않은 인덱스 속성에 대해서는 실행하지 않습니다. (예: 희소 배열) //function forEach (predicate,thisArg){ //for(let i = 0 ; i a의 요소들 console.log(v,i) },[1,2]); //[1,2] -> thisArg에 바인딩 2. map() map() 메서드는 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환합니다. //function map (predicate , thisArg){ // let arr = []; // for(let i = 0; i

비동기 프로그래밍 비동기 프로그래밍 동기처리와 비동기 처리 동기 함수를 호출하면 함수 코드가 평가되어 함수 실행 컨텍스트가 생성된다. 이때 생성된 함수 실행 컨텍스트는 실행 컨텍스트 스택(콜 스택)에 푸시되고 함수 코드가 실행된다. 함수 코드의 실행이 종료하면 함수 실행 컨텍스트는 실행 컨텍스트 스택에서 팝되어 제거된다. 자바스크립트 엔진은 단 하나의 실행 컨텍스트 스택을 갖는다. 이는 함수를 실행할 수 있는 창구가 단 하나이며, 동시에 2개 이상의 함수를 동시에 실행할 수 없다는 것을 의미한다. 자바스크립트 엔진은 한 번에 하나의 태스크만 실행할 수 있는 싱글 스레드 방식으로 동작한다. 싱글 스레드 방식은 한 번에 하나의 태스크만 실행할 수 있기 때문에 처리에 시간이 걸리는 태스크를 실행하는 경우 블로..

자바스크립트 객체의 분류 표준 빌트인 객체 Object , String , Number , Boolean , Symbol , Date , Math , RegExp , Array , Map/Set, WeakMap/ WeakSet, Function ,promise ,Reflect , Proxy ,JSON ,Error 등 40여 개의 표준 빌트인 객체를 제공한다. 표준 빌트인 객체는 ECMAScript 사양의 자바스크립트 실행 환경(브라우저/node.js)에서 모두 사용 가능한 공통 객체이다. 내 방식대로 정리한거 자바스크립트 내장 객체를 말함 개발자가 모든 기능을 구현하지않고, 편하게 개발할 수 있도록 자바스크립트에서 기본적으로 제공하는 객체 호스트 객체 호스트 객체는 ECMAScript 사양에 정의되어 있..

딥다이브 let,const 키워드와 블록 레벨 스코프 키워드 (keyword) 자바스크립트에서 특정한 목적을 위해 사용하는 단어이다. 문법상 어떤 역할을 하는 단어들이라고 이해하면 편하다. 이런 키워드들은 전부 예약어로 지정되어 있다. ex) return , for , break ,function등등 스코프(scope)? 스코프(scope)는 변수에 접근할 수 있는 범위를 말한다. 스코프는 크게 전역 스코프와 지역 스코프로 나눌 수 있다. 전역 스코프(global)는 어디에서든 해당 변수에 접근 가능한 걸 의미한다. 지역 스코프(local)의 경우, 한정적인 범위에서 해당 변수에 접근이 가능하다. 지역 스코프 안에 함수 스코프와 블록 스코프가 있으며 이 둘에 대해서 알아보도록 하자 함수 스코프(funct..

7장 연산자 목차 - 쫌 많네? 연산자 산술 연산자 할당 연산자 비교 연산자 삼항 조건 연산자 논리 연산자 쉼표 연산자 그룹 연산자 type of 연산자 지수 연산자 그 외의 연산자 연산자의 부수 효과 연산자 우선 순위 연산자 결합 순서 1.연산자 연산자는 하나 이상의 표현식을 대상으로 산술, 할당 , 비교 , 논리 , 지수 연산 등을 수행해 하나의 값을 만든다. 연산의 대상을 피연산자라고 하는데 피연산자는 값으로 평가 될 수 있는 표현식이어야 하고 연산자와 피연산자의 조합으로 이루어진 연산자 표현식도 값으로 평가 될 수 있는 표현식이다. (엄청 쉽게 말하면 피연산자는 연산에 참여하는 변수나 상수 민수 , 연산자는 기호) //산술연산자 5*4 //20 //문자열 연결 연산자 'My name is' + "..

ES6 문법이 표준화가 되면서 크게 신경쓰지 않아도 되는 부분이 되었지만 . JavaScript 라는 언어의 특성을 가장 잘 보여주는 특성 중 하나이기에 정리했습니다. 정의 hoist 라는 단어의 사전적 정의는 끌어올리기 라는 뜻이다. 자바스크립트에서 끌어올려지는 것은 변수이다. var keyword로 선언된 모든 변수 선언은 호이스트 된다. 호이스트란 변수의 정의가 그 범위에 따라 선언 과 할당으로 분리되는 것을 의미한다. 즉 , 변수가 함수 내에서 정의되었을 경우 , 선언이 함수의 최상위로 , 함수 바깥에서 정의 되었을 경우 , 전역 컨텍스트의 최상위로 변경이 된다. 우선 , 선언과 할당을 이해해야 한다. 끌어올려지는 것은 선언이다. function getX() { console.log(x); // ..