JS Day 3 ??연산자,변수,함수
16 Dec 2020 | JavascriptJS Day 3 ??연산자,변수,함수
-
null 병합 연산자
- a ?? b 와 같이 쓰며 a가 null 혹은 undefined가 아니면 a를 반환, 반대는 b를 반환
- ??연산자의 체이닝 (값이 있는 변수를 찾기 용이)
let A = null; let B = null; let C = "안녕?" alert( A ?? B ?? C ); // '안녕?' 출력- ?? 와 ｜｜ 연산자 비교
let money = 0; alert(money || 10000); //10000 출력, ||는 0을 falsy값으로 간주 alert(money ?? 10000); //0 출력, money가 null,undefined가 아니므로 값 반환 -
지역변수(Local Variable)와 전역변수(Global Variable)
- 함수 내에서 전역변수명과 같은 지역변수를 선언하면 지역변수에 가려진다
let greet = 'Hi'; function talk() { let greet = 'Hello'; //전역변수와 같은 이름의 변수 선언 alert(greet); } talk(); //Hello 출력 alert(greet); //Hi 출력, 전역변수가 바뀌지 않았다 -
매개변수의 default value
- 함수의 매개변수에 직접 default value를 지정 할 수 있다. default로 다른 함수도 호출 가능
function sayHello(to, text = "안녕?"){ //default value로 '안녕?' 설정 alert(to + " , " + text); } sayHello("Lee"); //'Lee , 안녕?' 출력 function sayHi(to, text = helloWorld()) {...} //이런식으로 함수 호출도 가능- 1번의 ?? 연산자로도 default value 설정 가능
function sayHello(text){ alert(text ?? '안녕?'); //text가 null or undefined면 '안녕?' 출력 } sayHello(0); //0 출력 sayHello(); //'안녕?' 출력 -
함수 표현식
- 자바스크립트는 함수를 값으로 취급해서 다양한 미친짓(?)을 할 수 있다
- 변수에 함수를 대입하거나 다른 변수에 넣어 함수를 복사 할 수도 있다
- 일반적인 식을 함수 선언문, 아래 예시와 같은 식을 함수 표현식이라 한다
let maxNum = function(a,b) { let result = (a>b) ? a : b; console.log(result); }; alert(maxNum); //함수 그 자체가 문자열로 출력된다 let findMax = maxNum; maxNum(2,3); //3 출력 findMax(2,3); //3 출력 -
콜백 함수
- 메인 함수의 매개변수에 함수를 넣어 연산식에 따라 함수를 나중에 호출하는 방식
- 이때 나중에 called back되는 함수를 ‘콜백 함수’라 한다
function calledBack(question, yes, no){ confirm(question) ? yes() : no(); } calledBack( "말해 yes or no", function(){console.log('YES!')}, //yes일 경우의 콜백 함수 function(){console.log('NO!')} //no일 경우의 콜백 함수 ); -
arrow function
- ES6의 문법으로 함수를 축약하여 표현할 수 있다
- 실행문이 한 줄이면 {} 생략 가능
- 매개변수가 한 개이면 () 생략 가능, but 매개변수가 없을때는 명시적으로 () 써야한다
let sum = function(a,b){ //원래 같으면.. return a + b; } let sum = (a,b) => a+b; //이 얼마나 아름다운가
