🤓 슬기로운 개발생활 🤓 슬기로운 개발생활

function a(){ let b = 10; function c(){ console.log(b); } c(); } a(); console.log(b); 위의 코드가 실행될 때 자바스크립트 엔진이 돌아가는 과정은 다음과 같다. 1. 먼저 전역 스코프에 위치하고 있는 변수 a를 담고, 변수 a에는 정의되어있는 함수를 할당한다. 2. 그 다음 a 함수가 호출되고 전역 컨텍스트에서 a가 실행되어 let b = 10 코드가 실행된다. 3. 이제 call stack memory에 a함수가 저장된 것과 마찬가지로 식별자 b와 c가 callstack에 저장된다(b : 10, c : function(){}). 4. 다음 c함수가 호출되고 console.log(b)를 만난다. 현재 활성화 상태인 c 컨텍스트에서 b를 검..

스코프(scope) 스코프란 쉽게 말해 변수의 유효범위이다. function start(){ for (let i = 0; i < 5; i++){ console.log(i); } console.log(i); } start(); 위의 코드를 실행 시켜보면 for 문 안에 console.log(i) 는 잘 실행된 반면, for 문 밖의 console.log(i)는 i가 정의되어 있지 않다고 에러가 뜬 것을 볼 수 있다. 그 이유는 i가 for 문 안에서만 유효한 변수이기 때문이다. 위의 오류를 해결하고 싶다면 아래와 같이 변수를 아예 밖에서 선언하여 스코프의 범위를 for문 밖으로 확장시킬 수 있다. function start(){ let i = 0; for(i = 0; i < 5; i++){ console...

기본형과 참조형을 구분하는 기준 데이터 타입의 종류는 크게 기본형과 참조형 2가지로 나뉜다. 기본형과 참조형을 구분 짓는 가장 큰 점은 실제 값 전체 복사 vs 실제 값이 들어있는 주소 값 복사이다. - 기본형 (copy value of a) let a = 1; let b = a; a += 10; console.log(a) //11 console.log(b) //1 위의 코드를 살펴보면 a의 값이 변하더라도 b의 값은 그대로 인 것을 볼 수 있다. let b = a; 코드를 통해 a값 전체가 복사되어 b라는 변수에 담겼다. a, b는 서로 영향을 받지 않고 독립적으로 존재하는 것을 볼 수 있다. 기본형 데이터가 저장될 때는 아래와 같은 순서로 저장된다. 1. 변수 영역에서 빈 공간(@1003 : 임의의 ..

브라우저의 주요 기능 인터넷 익스플로러, 크롬 등 우리가 사용하는 소프트웨어(앱)를 브라우저라고 한다. 브라우저의 가장 핵심 기능은 사용자가 url(자원이 있는 위치, 주소)을 입력했을 때 자원(주로 HTML파일)을 서버에 요청하고 브라우저에 표시하여 사용자에게 보여주는 기능이다. 크로스브라우징(웹 호환성) 브라우저도 인터넷 익스플로러, 파이어폭스, 사파리, 크롬 등 많은 종류가 있다. 과거에는 브라우저들이 저마다 독자적인 방법으로 브라우저를 만들어서 심각한 호환성 문제를 겪었다. (웹 서비스를 만드는데 크롬을 사용하는 유저, 인터넷 익스플로러를 사용하는 유저 등 각각의 브라우저에 맞게 웹 서비스를 만들어야 했다) 이 문제를 해결하기 위해 웹 표준화 기구인 W3C(World Wide Web Consort..

this let array = []; array.push(1); array.pop(); push, pop, shift, unshift 등 자바스크립트에서는 많은 메서드들을 사용할 수 있다. 메서드들은 자신이 속한 객체(마침표 앞의 객체)의 프로퍼티를 참조하고 변경할 수 있다. 자바스크립트에서 제공하는 메서드들은 이미 자바스크립트에서 정의를 해두었기 때문에 가져다 사용할 수 있다. function Example(){ this.storage = []; } Example.prototype.push = function(){ this.storage.push(1); return 1; } Example 생성자 함수를 생성했다. push 메서드는 storage에 1을 추가하는 메서드이다. 생성자 함수로 인스턴스를 생성..