[JavaScript] 웹 개발자로서 코드 품질 개선을 위한 구문들

💡 자바스크립트를 통해 어플리케이션을 개발함에 있어서 코드 품질 향상을 소홀히 하지 말자!

목표

• 웹 어플리케이션을 개발함에 있어서 유용한 구문들을 기록하고 정리할 수 있다.
• 유용한 정보를 기록하고 공유하는 공간으로 활용할 수 있다.

 

알아두면 좋을 구문들

JSON 유효성 검사

Open API를 통해 데이터를 받아오는 것이 자리를 잡은 만큼

요청 혹은 응답 데이터가 JSON 포맷인지 확인할 필요가 있다.

const isJSON = (str) => {
    try {
        JSON.parse(str);
        return true;
    } catch (e) {
        return false;
    }
};

isJSON('dad'); // false
isJSON('{a: 123}'); // false
isJSON(null); // true
isJSON('{}'); // true
isJSON('{"a": 123}'); // true

 

Cherry-Pick JSON Element(s)

최근에 알게된 유용한 구문인데, JSON.stringify를 통해 필요한 요소만을 필터링할 수 있다.

const obj = {firstName: 'WOONG', lastName: 'K', age: 30};
JSON.stringify(obj, ['firstName', 'lastName']);

'{"firstName":"WOONG","lastName":"K"}'

 

객체 직렬화

const stringify = (obj) => {
    for (let [key, value] of Object.entries(obj)) {
        console.log(`${key}: ${value}`);
    }
}

const obj = { firstName: 'WOONG', lastName: 'K', age: 30 };
stringify (obj);

firstName: WOONG
lastName: K
age: 30

 

함수 실행시간 측정

console.time() 과 console.timeEnd()로 실행시간을 측정할 수 있지만,

performance.now()를 통해서도 다음과 같이 실행시간을 확인해볼 수 있다.

var startTime = performance.now();

doSomething(); // Custom Biz Logic

var endTime = performance.now();
console.log("Call to doSomething took " + (endTime - startTime) + " milliseconds.");

console.time('somethingDoneTime');

doSomething(); // Custom Biz Logic

console.timeEnd('somethingDoneTime');

Call to doSomething took 1.209 milliseconds. // 1)
somethingDoneTime: 1.369s // 2)

console.time()과 performance.now() 가 서로 같은 함수를 불렀음에도 조금 다른 결과는 보여준다.

이는 성능 측정함에 있어서 중요한 문제가 아니다.

성능을 어떤 것으로 측정할지는 가독성이 더 좋다고 생각하는 Web API를 선택하면 된다.

 

두 날짜의 차이 일수 구하기

const substractEachDays = (startDate, endDate) => (endDate - startDate) / (1000 * 3600 * 24);

substractEachDays (new Date('2023-01-01'), new Date('2023-01-17')); // 16

 

 

출처

• 12 Important JavaScript Functions To Improve Code as a Web Developer, Paul Knulst, 2023-01-13
• console.time() vs performance.now(), tevemadar, 2021-03-13

 

 

Last Updated. 2023. 01. 18.