반응형

Javascript 개념 정리

Javascript를 다시 정리하는 의미에서 '모던 자바스크립트 deep dive'를 읽고 있습니다. 잊기 싫은 중요한 개념을 정리했는데요, 이번 포스팅에서는 리터럴, Javascript에서 함수 정의하는 4가지 방법, 표현식, 프로퍼티, 콜백함수에 대해 간단하게 메모했습니다. (출처: 모던 자바스크립트 deep dive)

Javascript콜백함수,리터럴?
Javascript콜백함수,리터럴?

리터럴

리터럴 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