[javascript] 자바스크립트 ES 2018 문법 체계 학습

/*jshint esversion: 6 */
//---------------------------------------------------------
//기본 팁 !!
//const와 let을 지향하므로 var는 버리자 !
//---------------------------------------------------------
 
const funcTest = (a, b) => a+b;
 
const funcTest2 = (a, b) =>{
    return a+b;
}
// output a+b
 
const funcTest3 = () =>{
    const teacher = {
        lecture(){
            console.log("수업 시작.");
        },
        status : {
            name:"이기주",
            age:25
        }
    }
    const {lecture, status} = teacher;
 
    console.log(status);
    lecture();
 
    // output :
    // { name: '이기주', age: 25 }
    // 수업 시작.
}
 
const addCosts = (name, ...costs) =>{
    costs.forEach(cost => {
        console.log(name, cost);
    });
 
}
// kiju 1
// kiju 2
// ...
 
const rest = (...data) => console.log(data);
 
const promiseExample = () =>{
    // 비동기식 통신의 순서, callback을 유용하게 대체할 수 있음
    Test.example('test')
    // 통신
    .then((user) =>{
        console.log(uesr);
        return 'a';
    })
    // 통신 잘 전달 입출력 되면 'a'출력
    .then((a)=>{
        cosnole.log(a);
        return 'b';
    })
    // 기다렸다가 다시 잘 되면 'b'출력
    .catch((err) =>{
        console.error(error);
    });
}
 
const promiseExample2 = new Promise((resolve, reject) =>{
    const a = 1;
    const b = 2;
    if(a + b < 2){
        resolve(a + b);
    }
    else{
        reject(a + b);
    }
});
 
const promiseExample2 = () => {
    const promise = new Promise((resolve, reject) =>{
        reject('');
    });
    // Promise가 무조건 성공하거나 실패 할 경우 아래가 더욱 가독성이 높음.
    const successPromise = Promise.resolve('성공');
    const successPromise = Promise.reject('실패');
 
}
 
const asyncAndAwait = () => {
    const promiseExample = () =>{
        // 비동기식 통신의 순서, callback을 유용하게 대체할 수 있음
        Test.example('test')
        // 통신
        .then((user) =>{
            console.log(uesr);
            return Test.test2('a');
        })
        // 통신 잘 전달 입출력 되면 'a'출력
        .then((a)=>{
            cosnole.log(a);
            return Test.test3('a');
        })
        // 기다렸다가 다시 잘 되면 'b'출력
        .catch((err) =>{
            console.error(error);
        });
    // 위와 같은 Promise를 async/await으로 대체 가능하다.
    }
    const asyncExample = () => {
        // async 예제.
        async asyncExample =>{
            try{
                const test = await Test.example('test');
                console.log('example 성공.');
                // 비동기식으로 로그가 계속해서 출력 됨.
                const test2 = await Test.test2('a');
                console.log('test2 성공.');
                const test3 = await Test.test3('a');
                console.log('test3 성공.');
            } catch(err){
                console.log(err);
            }
            // 어떤 과정에서 에러가 발생했는지 알려면, 통신 마다 try문을 사용해줘야 함.
        }
    }
}
async function goWork(time1, timeStartWork) {
  const time2 = await wakeUp(time1)
  const time3 = await takeSubway(time2)
  const time4 = await takeOffSubway(time3)
  const arrivalTime = await arriveWork(time4)
  if (arrivalTime > timeStartWork) {
    fire()
  }
}
 
 
// [1,2,3,4]
addCosts("kiju", 1, 2, 3, 4, 5);
rest(1,2,3,4);
// console.log(funcTest(1,2));
// funcTest3();

 

기본적인 문법들을 학습 겸 연습해보았습니다.

ES2018 중 가장 써보고 싶은 부분은 callback을 대체할 promise와 화살표 함수네요 ~ 정말 편리해보입니다.