Archive

JS Day 3 ??연산자,변수,함수

16 Dec 2020 | Javascript

JS Day 3 ??연산자,변수,함수

  1. 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가 아니므로 값 반환


  2. 지역변수(Local Variable)와 전역변수(Global Variable)

    • 함수 내에서 전역변수명과 같은 지역변수를 선언하면 지역변수에 가려진다
    let greet = 'Hi';
   
function talk() {
    let greet = 'Hello'; //전역변수와 같은 이름의 변수 선언
    alert(greet);
}
talk(); //Hello 출력
alert(greet); //Hi 출력, 전역변수가 바뀌지 않았다


  3. 매개변수의 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(); //'안녕?' 출력


  4. 함수 표현식

    • 자바스크립트는 함수를 값으로 취급해서 다양한 미친짓(?)을 할 수 있다
    • 변수에 함수를 대입하거나 다른 변수에 넣어 함수를 복사 할 수도 있다
    • 일반적인 식을 함수 선언문, 아래 예시와 같은 식을 함수 표현식이라 한다
    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 출력


  5. 콜백 함수

    • 메인 함수의 매개변수에 함수를 넣어 연산식에 따라 함수를 나중에 호출하는 방식
    • 이때 나중에 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일 경우의 콜백 함수
);


  6. arrow function

    • ES6의 문법으로 함수를 축약하여 표현할 수 있다
    • 실행문이 한 줄이면 {} 생략 가능
    • 매개변수가 한 개이면 () 생략 가능, but 매개변수가 없을때는 명시적으로 () 써야한다
    let sum = function(a,b){ //원래 같으면..
    return a + b;
}
   
let sum = (a,b) => a+b; //이 얼마나 아름다운가



참고 자료

JAVASCRIPT.INFO

Related Posts