mysql과 mysql2 차이

Mysql과 Mysql2의 가장 큰 차이점은 Promise 지원 여부입니다.

Mysql은 Callback 기반으로 동작하는 반면에, Mysql2는 Promise를 지원하며 CallBack과 같이 활용할 수 있습니다.

Mysql에서 Promise를 사용하기 위해서는 별도의 모듈인 'promise-mysql'을 설치해야 하는 번거로움이 있습니다.

여기서 callback과 promise는 비동기 작업을 처리하는 방법입니다.

---

동기와 비동기

동기(Synchronous)란, 한 작업이 끝날 때까지 다음 작업을 기다리는 방식으로, 순차적으로 작업을 처리합니다.

비동기(Asynchronous)는 한 작업의 완료 여부와 상관없이 다음 작업을 실행하는 방식으로, 한 번에 여러 작업을 처리할 수 있습니다.

출처 : https://d-sup.github.io/javascript/study/

 

callback

파라미터로 함수를 전달받아 함수의 내부에서 실행하는 함수입니다.

// callback

function asyncFun(callback){
	console.log('시작');
    
    setTimeout(funcion(){
    	console.log('완료');
        const result = 2
        callback(result);
    }, 1000);
}


function finalResult(finalResult) {
  console.log("결과:", finalResult);
}

asyncFunc(function (result) {
  finalResult(result * 2)
});


// '시작'
// '완료'
// '결과: 4'

 

비동기 함수에서 작업 결과를 전달받아 처리하는 데 사용하면서 작업 순서를 맞출 수 있다는 장점이 있지만, 비동기적인 작업을 처리할 때 콜백 함수를 중첩해서 사용하다 보면 콜백지옥으로 인해 코드가 복잡하고 가독성이 떨어질 수 있는 단점이 존재합니다.

function signup(id, pw){
	// 아이디 중복 체크
    checkId(id, function(userId){
    	if (!userId){
        	// 패스워드 유효성 검사
            checkPw(pw, funcion(userPw){
            	if(!userPw){
                	// 가입
                }
            })
        }
    })
}

 

 

promise

callback의 단점을 극복하기 위해 promise라는 비동기 처리를 위한 전용객체가 생겼습니다.

promise는 비동기 작업의 성공 또는 실패와 그 결과값을 나타내는 객체로 promise를 사용하면 비동기 작업을 쉽고 깔끔하게 연결할 수 있게 됩니다.

promise는 생성자 함수를 호출할 때 함수인자로 콜백함수를 선언할 수 있습니다.

콜백함수는 resolve와 reject 두 개의 함수를 인자로 받는데 resolve 메서드는 Promise 객체가 성공 상태가 될 때 호출, reject는 실패 상태가 될 때 호출됩니다.

 

상태

promise는 생성하고 종료될 때 까지 총 3가지 상태를 갖습니다.

Pending(대기) : 비동기 처리 로직이 아직 완료되지 않은 상태

Fulfilled(이행) : 비동기 처리가 완료되어 프로미스가 결과 값을 반환해 준 상태

Rejected(실패) : 비동기 처리가 실패하거나 오류가 발생한 상태

let promise = new Promise((resolve, reject) => {
	asyncFun(param, function A(err, result){
    	if(err){ reject(err) }
		else{ resolve(result) }    
    })
})

promise.then(function(result){
	// 성공
}).catch(function(err){
	// 실패
})

 

promise도 체인이 길어질수록 코드가 복잡해지며 가독성이 떨어져 유지보수가 어려워지는 상황이 발생합니다.

 

 

async/await

promise의 불편한 점을 해결하기 위해 ES7(ES2017)에서 async/await 문법이 추가되었습니다. 이 코드를 사용하면 비동기 코드를 마치 동기 코드처럼 보이게 작성이 가능합니다.

promise는 catch 메서드를 통해 에러를 받지만, async/await에서는 try/catch로 일관된 예외처리가 가능합니다.

 

async

 - 함수를 비동기 함수로 선언하는 역할로, await를 사용하기 위한 선언문

 - function 앞에 async를 붙어줌으로써, 함수내에서 await 키워드를 사용할 수 있게 된다.

 - async가 붙은 function의 리턴값은 Promise 객체로 감싸져 반환된다.

await

 - 일반 비동기 처리처럼 바로 실행이 다음 라인으로 넘어가는 것이 아니라 결과값을 얻을 수 있을 때까지 기다린다.

 - Promise가 처리될 때 까지 코드 실행을 일시 중지하고, Promise가 처리되면 결과 값을 반환해서 변수에 할당한다.

 

1) await의 기능

 

 - await 뒤에 오는게 Promise 객체면 promise의 resolve 값으로 바꿔준다.

// 예시 1.

function fun1(){
	return Promise.resolve('promise');
}

function fun2(){
	return 'non_promise';
}

async function check(){
	const p1 = await fun1(); // promise      
    const p2 = fun1(); // Promise { 'promise' }
    const non_p1 = await fun2(); // non_promise
    const non_p2 = fun2(); // non_promise
}

check();

fun1()은 promise 객체를 반환하고, fun2()는 문자열을 반환하는 함수입니다.

fun1()에서 await를 붙여주지 않으면 promise 객체 자체가 출력되고, await를 붙여주면 promise의 resolve 값이 출력되고, 문자열을 반환하는 함수 fun2()에서 await의 유무는 차이점이 없는 것을 볼 수 있습니다.

await 뒤에 오는 모든 값은 promise 객체화 됩니다.

 

 - async 함수가 비동기적으로 실행되도록 한다.

await 문이 없는 asnyc는 동기적으로 실행되고, await문이 있는 async 함수는 항상 비동기적으로 완료됩니다.

 

2) 에러 핸들링

async function test(){
	try {
 		const x = Promise.reject(new Error('Oops!'));
        await x; // await가 p의 reject값을 catch의 인자로 throw
    } catch (error) {
    	console.log(error.message) // 'Oops!'
    }
}

에러 구문은 try/catch 구문으로 구현이 가능하며 try/catch 구문은 await 뒤에 오는 promise 객체가 rejected일 때, reject 결과값을 catch의 인자로 넘겨줍니다.

 

---

참고

https://d-sup.github.io/javascript/study/

Promise와 Callback의 차이는? && async/await란?

https://charles098.tistory.com/159

[ JavaScript ] async/await