[JavaScript] 06. 스코프와 호이스팅 스코프와 호이스팅은 JavaScript의 동작 방식을 이해하는 데 중요한 개념이다. 변수와 함수가 어디에서 접근 가능한지, 그리고 코드 실행 전에 어떤 일이 일어나는지를 설명한다. 1) 스코프(Scope)란? 스코프는 변수에 접근할 수 있는 범위를 의미한다. 2) 전역 스코프 함수 밖에서 선언된 변수는 전역 스코프를 가진다. 어디에서든 접근할 수 있다. let globalVar = "Hello";function test() { console.log(globalVar);}test(); 3) 지역 스코프 함수 안에서 선언된 변수는 해당 함수 내부에서만 사용할 수 있다. ..
[JavaScript] 05. 함수(Function) 함수는 여러 번 사용할 수 있는 코드 묶음이다. 반복해서 사용되는 코드를 하나로 정리하여, 필요할 때 호출해서 사용할 수 있다. 1) 함수란? 함수는 특정 작업을 수행하도록 미리 정의해 놓은 코드 블록이다. function sayHello() { console.log("Hello");} 위처럼 함수를 정의한 뒤, 함수 이름을 사용해 실행할 수 있다. sayHello(); 2) 함수의 구성 함수 이름 매개변수(parameter) 반환값(return) function add(a, b) { return a + b;} a, b는 매개변수이고, ..
[JavaScript] 04. 반복문 반복문은 같은 작업을 여러 번 실행해야 할 때 사용한다. 조건이 만족되는 동안 특정 코드를 반복해서 실행할 수 있다. 1) 반복문이 필요한 이유 동일한 코드를 여러 번 작성하는 것은 비효율적이다. 반복문을 사용하면 코드의 길이를 줄이고, 같은 규칙을 가진 작업을 쉽게 처리할 수 있다. // 반복문 없이 작성한 경우console.log(1);console.log(2);console.log(3); // 반복문 사용for (let i = 1; i 2) for 문 for 문은 반복 횟수가 명확할 때 자주 사용된다. for (let i = 0; i 초기식 : 반복을 시작할 변수 선언 조건식..
[JavaScript] 03. 연산자와 조건문 JavaScript에서 연산자는 값을 계산하거나 비교할 때 사용한다. 조건문은 조건에 따라 다른 동작을 수행하도록 흐름을 제어한다. 1) 연산자란? 연산자는 하나 이상의 값을 이용해 새로운 값을 만들어내는 기호이다. 2) 산술 연산자 + : 더하기 - : 빼기 * : 곱하기 / : 나누기 % : 나머지 let a = 10;let b = 3;a + b; // 13a - b; // 7a * b; // 30a / b; // 3.333...a % b; // 1 3) 대입 연산자 대입 연산자는 값을 변수에 저장할 때 사용한다. let x = 10;x += 5; // ..
[JavaScript] 02. 변수와 데이터 타입 JavaScript에서 변수는 값을 저장하기 위한 공간이다. 프로그램 실행 중 필요한 값을 변수에 담아두고, 이후 다시 사용할 수 있다. 1) 변수란? 변수(variable)는 말 그대로 값이 변할 수 있는 저장 공간이다. 숫자, 문자, 논리값 등 다양한 데이터를 저장할 수 있다. let num = 10;num = 20; 위 코드처럼 변수에 저장된 값은 이후에 다른 값으로 변경할 수 있다. 2) 변수 선언 방법 JavaScript에서는 변수를 선언할 때 아래 키워드를 사용한다. var let const var a = 1;let b = 2;const c = 3; ..
[JavaScript] 01. JavaScript란 무엇인가 JavaScript는 웹 페이지에 동적인 기능을 추가하기 위해 사용되는 프로그래밍 언어이다. HTML이 페이지의 구조를 담당하고, CSS가 디자인을 담당한다면, JavaScript는 동작과 로직을 담당한다. 버튼 클릭, 입력 처리, 화면 변경처럼 사용자의 행동에 따라 웹 페이지가 반응하도록 만드는 역할을 한다. 1) JavaScript의 역할 JavaScript로 할 수 있는 대표적인 기능은 다음과 같다. 버튼 클릭, 입력 등 사용자 이벤트 처리 입력값 확인 및 조건에 따른 처리 화면 요소의 내용 변경 서버와 데이터 통신 간단한 애니메이션 효과 2) HTML..