본문 바로가기

JavaScript

(14)
[JavaScript] 호이스팅(Hoisting) 호이스팅(Hoisting)의 사전적 의미는 "끌어 올리다" 라는 뜻을 가진다. JavaScript에서도 같은 의미로 사용 되며, 실제로 코드가 끌어올려지는 것은 아니며, JavaScript Parser가 내부적으로 끌어올려서 처리한다. var 와 "함수 선언문" 이 호이스팅 대상이다. let, const, "함수 표현식"은 호이스팅에 해당 되지 않는다.
[JavaScript] 함수 선언식 / 함수 표현식 // 함수 선언식 function printHelloWorld() { console.log("Hello World!"); } printHelloWorld(); // 함수 표현식 let printHelloWorld = function() { console.log("Hello World!"); }; printHelloWorld(); 함수 선언식은 호이스팅에 영향을 받는다. 함수 표현식은 호이스팅에 영향을 받지 않는다. 함수 선언식은 코드를 구현한 위치와 관계없이 자바스크립트의 특징인 호이스팅에 따라 브라우저가 자바스크립트를 해석 할 때 맨 위로 끌어 올려진다. // 함수 선언식 printHelloWorld(); // "Hello World!" function printHelloWorld() { console..
[JavaScript] 페이지 라이프사이클 페이지 라이프사이클은 크게 3가지로 분류된다. DOMContentLoaded HTML이 모두 로드되고, DOM 트리가 완성 되었지만,외부 리소스가 아직 로드 되지 않았을 때 ※ DOM이 준비된 상태이기 때문에, DOM 노드를 제어 할 수 있다. load 브라우저에 모든 리소스(img, style, script, etc)가 로드 되었을 때 ※ 모든 리소스가 로드된 시점이기에, image 사이즈와 같은 것들을 얻을 수 있다. beforeunload / unload 페이지를 떠날 때 (사용빈도 낮음) ※ 변화에 따른 저장 여부 및 페이지 이탈 여부를 확인할 수 있다. 위 내용을 보았을때, "DOMContentLoaded" 가 "load" 보다 빨리 발생한다는 것을 알 수 있다. load 보다 jQuery의 r..
[JavaScript] 매개변수(Parameter) 매개변수(Parameter)를 이용하면 원하는 데이터를 원하는 함수에 전달 할 수 있습니다. 매개변수는 1개 또는 여러개를 전달 할 수 있습니다. 문자, 숫자 등 다양한 타입을 전달 하여 사용 할 수 있습니다. (예제1) // 매개변수가 1개 있는 함수 선언 function sayHello(name) { alert("Hello " + name + "!"); } sayHello("Lee"); // "Lee"를 넘겨주며 sayHello()함수 호출 sayHello("Choi"); // "Choi"를 넘겨주며 sayHello()함수 호출 // 매개변수가 2개 있는 함수 선언 function person(name, age) { alert("Hello " + name + "! " + "You are " + age..
[JavaScript] 함수(function) 함수는 프로그램을 구성하는 주요 구성요소 입니다. 잘 만들어진 함수를 이용하면 중복 없이 유사한 동작을 하는 코드를 여러번 호출 가능합니다. 함수는 간결하게 한가지 기능만 수행 할 수 있도록 만들어야 합니다. (예제1) function sayHello() { alert("Hello kim!"); } sayHello(); // 함수 호출 위 (예제1)은 "Hello kim"을 alert 창에 보여주는 작업을 하는 함수입니다. 이렇게 함수를 만들어 두면 원하는 곳에서 함수 호출을 하여 간편하게 원하는 동작을 하게 만들 수 있습니다. (예제2) function sum(a, b) { return a + b; // 전달 받은 값을 더하기 연산 후 반환 } let result = sum(1, 2); // 1 과 2..
[JavaScript] 전역 변수 와 지역변수 변수는 유효범위에 따라 전역변수(Global Variable)와 지역변수(Local Variable)로 구분할 수 있다. Javascript 변수 유효범위는 변수를 어디에서 접근 할 수 있느냐를 가르킨다. 전역변수는 함수 외부에서 선언된 변수로, 프로그램 전체에서 접근할 수 있는 변수이다. 지역변수는 함수 내부에서 선언된 변수로, 함수가 실행되면 만들어지고 함수가 종료되면 소멸하는 변수이다. 지역변수는 함수 외부에서는 접근할 수 없다. let name = "global" // 전역변수를 선언 function scopeTest() { let name = "local" // 지역 변수를 선언 console.log(name); // 전역 변수가 아닌 지역변수를 사용 } scopeTest(); // "local..
[JavaScript] null / undefined 란 let age = null; console.log(age); // null; Javascript의 null은 다른 언어의 null과 성격이 다릅니다. 다른 언어에서는 존재하지 않는 객체에 대한 참조 / 널 포인터(null pointer)를 나타낼 때 사용합니다. Javascript에서는 null을 (존재하지 않는 값 / 비어있는 값 / 알 수 없는 값) 을 나타낼 때 사용됩니다. let age; console.log(age); // undefined undefined 는 값이 할당되지 않은 상태를 나타낼 때 사용합니다. 변수는 선언 했지만, 값을 할당하지 않은 경우 해당 변수에 undefined가 자동으로 할당 됨
[Node js] Blocking Code / Non-Blocking Code 란 let fs = require("fs"); let data = fs.readFileSync("sample.txt"); console.log(data.toString()); console.log("프로그램이 종료 되었습니다."); 위 예제는 Callback Function이 사용 되지 않는, Blocking Code 입니다. 위 코드를 실행 해보면 파일을 읽고 텍스트를 출력 한 후 "프로그램이 종료 되었습니다." 로그가 찍힌다. 즉, 파일을 찾고 읽고 toString() 하고 출력 후 "프로그램이 종료 되었습니다."가 순서대로 실행 된다. let fs = require("fs"); // 모든 Node 어플리케이션의 비동기식 함수에서는 첫번째 매개변수로는 error를 받는다. // 마지막 매개변수로는 cal..