💙자바스크립트란?
HTML은 구조, CSS는 디자인, 자바스크립트(JavaScript)는 동작을 담당한다.
JavaScript는 컴파일(Compile)언어가 아닌 인터프리터(Interpreter) 언어다.
인터프리터
프로그래밍 언어의 소스 코드를 한 줄씩 읽으면서 실행하는 컴퓨터 프로그램이다.
컴파일
프로그램 전체 코드를 스캔하여 기계어로 번역해서 사용한다.
초기에는 프로그래밍 언어로 생각 안 했지만 웹 브라우저, 하드웨어 성능이 항샹되어 대중적인 언어로 자리 잡았다.
스크립트 선언은 어디든 가능하지만 위치에 따라 실행 시점과 결과가 달라질 수 있다.
보통 바디 태그 끝 부분이 일반적이고 권장되는 위치이다.
💙변수
변수 선언
var 키워드 사용
var x;
var x, y, 변수 할당
var x = 5;
var y = 3, z = 5, w = 4;호이스팅
프로그램은 작성한 순서대로 실행되지만, 변수 선언은 중간에 해도 첫머리에 선언된 것처럼 생성된다.
Java와는 다르게 변수에 데이터의 타입 지정을 안한다.
데이터 타입 -> int, char, float 등등
문자형, 숫자형, 논리형, 빈데이터형 변수에 대입 가능하다.
undefined
정의는 되었지만, 값이 할당되지 않을때 사용한다. (할당 필요 X)
null
값이 비어있는 경우 사용한다. (할당 필요 O)
💙출력
alert( )
경고창을 띄워준다.
alert('안녕하세요');
// 변수 사용 가능
var msg = '안녕하세요';
aler(msg);console.log()
개발자 도구에 변수의 값을 출력한다.
console.log('안녕하세요');
// 변수도 사용가능💙리턴 함수(Return Function)
return문이 실행되면 코드는 종료한다
function sumCalc( ){
var sum = 0;
if(sum = 55){
return 55; // sum이 55가 되면 함수 종료, 55를 반환
}
sum += 5;
}💙중첩 함수(Nested Function)
함수 내부에 선언된 함수이다. 지역 함수, 내부 함수라고도 한다.
외부 함수에서 내부 함수를 읽거나 쓸 수 없어 감추고 싶은 기능을 구현할 때 사용한다. (자바와 다르게 접근 제한자가 없어 중첩 함수 사용)
ex) 비밀번호 유효성 검사, 숫자 계산 시 내부 로직 분리, 토큰 유효성 검사(보안 기능 감춤)
💙재귀 함수(Recurslve call Function)
함수 정의문 내에서 작성한 코드로 함수를 다시 호출하는 것이다.
함수를 반복문처럼 여러 번 호출하기 위해 사용한다. (중간에 멈출 수 있는 조건 필수)
호출된 횟수만큼 메모리 사용량이 늘어나 사용을 지양한다.
💙콜백 함수(Callback Function)
매개 변수로 함수 객체를 전달해서 호출 함수 내에서 매개변수 함수를 실행하는 것이다.
function sayHello(name, callback) {
const words = '안녕하세요 내 이름은 ' + name + ' 입니다.';
callback(words); // 매개변수의 함수(콜백 함수) 호출
}
sayHello("주희", function printing(name) {
console.log(name); // 안녕하세요 내 이름은 주희 입니다.
});
💙함수 리턴
자바스크립트는 함수를 리턴할 수 있다.
💙클로저(closure)
클로저는 함수와 그 함수가 선언됐을 때의 렉시컬 환경(Lexical environment)과의 조합이다.
렉시컬 환경(Lexical environment)
코드 block, function, script를 실행하기 앞서 생성되는 객체로 실행할 스코프 범위 안에 있는 변수와 함수를 프로퍼티로 저장하는 객체이다.
즉, 클로저는 반환된 내부함수가 자신이 선언됐을 때의 환경(Lexical environment)을 기억하여 자신이 선언됐을 때의 환경(스코프) 밖에서 호출되어도 그 환경(스코프)에 접근할 수 있는 함수를 말한다.
-> 클로저는 자신이 생성될 때의 환경(Lexical environment)을 기억하는 함수다.
var count = 0; 이라는 구문이 있어 아무리 함수를 불러도 1이 될 것 같지만 내부의 count 변수가 증가하고 유지되어 숫자가 올라간다
-> 클로저
🤍회고
자바스크립트는 예전에 공부했다고 생각했지만, 함수의 종류와 활용도가 이렇게 다양한 줄은 몰랐다. 이론으로는 공부했지만, 실제로 내가 함수를 제대로 활용해 코드를 작성할 수 있을지에 대한 의문이 든다. 예제를 더 많이 풀어보며 연습이 필요할 것 같다.
