Javascript 개념 정리, 콜백함수 리터럴
반응형
Javascript 개념 정리
Javascript를 다시 정리하는 의미에서 '모던 자바스크립트 deep dive'를 읽고 있습니다. 잊기 싫은 중요한 개념을 정리했는데요, 이번 포스팅에서는 리터럴, Javascript에서 함수 정의하는 4가지 방법, 표현식, 프로퍼티, 콜백함수에 대해 간단하게 메모했습니다. (출처: 모던 자바스크립트 deep dive)
리터럴
리터럴 literal은 사람이 이해할 수 있는 문자 또는 약속된 기호를 사용해 값을 생성하는 표기법 notation을 말한다.
리터럴 | 예시 | 비고 |
정수 리터럴 | 100 | |
부동소수점 리터럴 | 10.5 | |
2진수 리터럴 | 0b010001 | 0b로 시작 |
8진수 리터럴 | 0o101 | ES6에서 도입. 0o으로 시작 |
16진수 리터럴 | 0x41 | ES6에서 도입. 0x로 시작 |
문자열 리터럴 | 'hello' "world" | |
불리언 리터럴 | true false | |
null 리터럴 | null | |
undefined 리터럴 | undefined | |
객체 리터럴 | {name:'Lee', address:'Seoul'} | |
배열 리터럴 | [1,2,3] | |
함수 리터럴 | function(){} | |
정규 표현식 리터럴 | /[A-Z]+/g |
3 //숫자 리터럴 3
//변수에 함수 리터럴을 할당
var f = function add(x,y){
return x+y;
};
함수 정의
//함수 선언문
function add(x,y){
return x+y;
}
//함수 표현식
var add = function(x,y){
return x+y;
};
//Function 생성자 함수
var add = new Function('x', 'y','return x+y');
//화살표 함수 ES6
var add = (x,y) => x+y;
표현식
표현식 expression은 값으로 평가될 수 있는 문이다. 표현식이 평가되면 새로운 값을 생성하거나 기존 값을 참조한다.
10 //숫자 리터럴 표현식
sum //식별자 표현식(선언이 이미 존재한다고 가정)
10+20 //연산자 표현식
person.getName() //함수 /메서드 호출 표현식 (선언이 이미 존재한다고 가정)
프로퍼티
객체는 프로퍼티의 집합이며, 프로퍼티는 키와 값으로 구성된다.
var person = {
name : 'Lee',
age : 30
};
//프로퍼티 키는 nae, 프로퍼티 값은 'Lee'
//프로퍼티 키는 age, 프로퍼티 값은 20
프로퍼티를 나열할 때는 쉼표(,)로 구분, 일반적으로 마지막에는 쉼표를 사용하지 않는다.
프로퍼티 키: 빈 문자열을 포함하는 모든 문자열 또는 심벌 값
프로퍼티 값: 자바스크립트에서 사용할 수 있는 모든 값
콜백 함수
함수의 매개변수를 통해 다른 함수의 내부로 전달되는 함수를 콜백 함수라고 한다. 매개변수를 통해 함수의 외부에서 콜백 함수를 전달받은 함수를 고차 함수라고 한다. 고차 함수에 콜백 함수를 전달할 때 콜백 함수를 호출하지 않고 함수 자체를 전달해야 한다.
//고차함수 repeat
function repeat(n,f){
for (var i = 0;i<n ;i++){
f(i);
}
}
//콜백함수 logAll
var logAll = function (i){
console.log(i);
};
//고차함수 repeat안에 인수로 콜백함수(logAll)넣기
repeat(5,logAll); //0 1 2 3 4
반응형
'컴퓨터 IT > Javascript' 카테고리의 다른 글
React fetch 사용법 Loading,Error,GET,POST (0) | 2023.07.17 |
---|---|
자바스크립트 this 정복하기 (0) | 2023.07.03 |
리팩터링이란? (0) | 2023.06.19 |
ESLint 쉬운 설치 방법 (0) | 2023.02.20 |
자바스크립트 Bubbling (0) | 2022.12.19 |
댓글
이 글 공유하기
다른 글
-
React fetch 사용법 Loading,Error,GET,POST
React fetch 사용법 Loading,Error,GET,POST
2023.07.17 -
자바스크립트 this 정복하기
자바스크립트 this 정복하기
2023.07.03 -
리팩터링이란?
리팩터링이란?
2023.06.19 -
ESLint 쉬운 설치 방법
ESLint 쉬운 설치 방법
2023.02.20