우당탕탕 개발일지

cmd(명령 프롬프트)에서 node를 실행하면 javascript를 사용할 수 있습니다. 이렇게 cmd에서 console.log(1)을 찍으면 1이 출력되는 것을 알 수 있습니다. 근데 1 밑에 undefined가 같이 출력되는걸 보고 console.log(1) 말고는 없는데 어디서 나온거지 너무 궁금했습니다. 결론은 REPL의 특성 때문입니다. REPL이란 Read Eval Print Loop의 약자입니다. REPL은 명령줄 인터페이스인 CLI에서 동작합니다. 윈도우에서는 cmd, powershell 환경에서 사용이 가능합니다. 약자에 의미가 다 담겨있습니다. REPL이 실행 상태에서는 입력한 소스코드를 읽고(Read) 명령어를 평가(Eval)하고 결과를 출력(Print)한 다음 다시 입력을 기다리는 ..

저번에는 Object.keys 메서드에 대한 포스팅을 작성했습니다. 이번에는 위 메서드와 같이 유용하게 사용할 수 있는 Object.values 메스드에 대해 알아보려고 합니다. 객체를 마주하다보면 가끔 객체의 value값들만 가지고 오고 싶을때가 종종 있습니다. Object.values() 메서드는 객체의 프로퍼티들 중에서 value값만 묶어서 배열로 반환해주는 메서드입니다. const obj = { 1: 'red', 2: 'blue', 3: 'yellow' 4: 'green' 5: 'black' } const values = Object.values(obj); console.log(values); // ["red", "blue", "yellow", "green", "black"] 위 예제에서는 obj..

JavaScript는 객체 기반 프로그래밍 언어입니다. 그렇기 때문에 자바스크립트를 구성하는 거의 대부분이 객체로 이루어져있습니다. 객체를 관련해 다루는 메서드가 있다면 유용하게 사용을 할 수 있을 것입니다. 객체를 마주하다보면 가끔 객체의 key값만 가지고 오고 싶을때가 종종 있습니다. Object.keys() 메서드는 객체의 프로퍼티들 중에서 key값만 묶어서 배열로 반환해주는 메서드입니다. const obj = { name: 'leo', age: '26', gender: 'm' } const keys = Object.keys(obj); console.log(keys); // ["name", "age", "gender"] 위 예제에서는 obj 객체에서의 key값들인 name, age, gender가 ..

일단 Moment.js부터 설명을 하겠습니다. Moment.js는 JavaScript에서 날짜 및 시간을 조작하고 작업하는데에 도움을 주는 라이브러리입니다. 날짜 관련 라이브러리 중에서 가장 오래되고 가장 많이 사용되던 라이브러리입니다. 하지만 moment.js는 앞으로 업데이트가 없을 예정이기 때문에 다른 라이브러리 사용을 권장하고 있습니다. 현재로서는 moment를 사용해도 문제가 없지만 다른 라이브러리를 권장하고 있는 와중에 moment를 고집할 필요는 없다고 판단했습니다. (유지보수 측면에서도 유리할 것으로 생각했습니다.) 대체할 라이브러리를 찾아보던 와중에 day.js라는 라이브러리가 눈에 띄었습니다. moment.js의 문법과 거의 유사하여 어렵지 않게 적용이 가능할 것이라고 생각했습니다. d..

javascript에서의 reduce는 배열 내 각각 요소를 순회하여 callback 함수의 실행 값을 누적하여 최종 결과값을 반환해주는 메서드입니다. arr.reduce(callback[, initialValue]) Parameter 1. callback: 배열의 각 요소에 대해 실행할 함수입니다. 4가지의 인수를 받습니다 accumulator - 콜백함수의 반환값을 누적합니다. currentValue - 배열에서의 현재 요소 index(Optional) - 배열에서의 현재 요소의 인덱스 array(Optional) - 호출한 배열 2. initialValue(Optional): callback의 최초 호출에서 첫 번째 인수에 제공하는 값입니다. const numbers = [1, 2, 3, 4]; ..

javascript에서의 map은 배열 내 각각 요소를 주어진 함수로 호출한 결과를 모아 새로운 배열을 반환해주는 메서드입니다. let arr = [1, 2, 3, 4, 5]; 위처럼 주어진 배열이 있다고 생각하고 각 항목에 +1을 해주어 새로운 배열을 정의하고 싶다고 했을 때 map이 아닌 for문을 사용해서 작성하면 let newArr = []; for(let i = 0; i { return v + 1; }) console.l..

오늘은 Javascript에서 filter라는 함수의 사용법에 대해서 알아보려고합니다. 배열 관련 함수 중 많이 쓰이는 함수들은 filter, map, reduce 등 있습니다. 그중에서도 filter는 활용도가 높은 편이라 자세히 알아두면 굉장히 유용하게 사용할 수 있을 거 같습니다. filter 메서드는 조건을 주고 해당 조건이 true인 요소를 모아 새로운 배열로 반환하는 메서드입니다. 배열에서 추출 하고 싶은 데이터가 있을 경우 자주 사용합니다. filter는 중복값을 제거해주지 않아 중복값이 반환될 수 있습니다. 정의 Array.prototype.filter(callback(element[, index[, array]])[, thisArg]) callback : 각 요소에 조건 값 (true: ..

Javascript ES2022에서 추가된 기능들이 몇가지 있습니다. 그중에서 가장 유용하고 많이 사용하게 될 거 같은 기능들에 대해서 알아보려고 합니다. Top-level await //기능이 나오기 전에 await를 사용하는 예 (async function () { await start(); })(); //기능이 나온 후 await를 사용하는 예 (async 없이 바로 선언) await start(); Top-level await 기능이 나오기 전에는 await를 사용하려면 async 함수 내에서만 사용해야만 했습니다. 모듈 최상단에서 사용하고 싶었지만 사용할 수 없었습니다. 하지만 이제 await은 최상단에서도 사용할 수 있습니다. Error cause Error cause를 활용하면 오류의 원인을..

자바스크립트는 여러가지의 반복문이 존재합니다. for for in for of forEach() while do while for문 for (let i = 0; i < 10; i++) { console.log(i) } // 출력결과 0 1 2 3 4 5 6 7 8 9 for in문 for in문은 특정 객체의 열거 가능한 모든 프로퍼티(enumerable properties)를 순회할 수 있게 합니다. 열거 가능한 프로퍼티는 enumerable 플래그가 true인 프로퍼티를 뜻 합니다. const obj = { name: "ujam", job: "engineer", age: 25 } for (const key in obj) { console.log(`${key} : ${obj[key]}`); } /* 출..

JavaScript 삼항연산자는 true/false에 따라서 실행되는 조건문입니다. 조건문 ? 선택문1 : 선택문2 삼항연산자는 이런식으로 구성됩니다. 조건문이 true면 선택문1, false면 선택문2를 실행합니다. 일반적인 if문 입니다. let num = 1; if (num == 1) { console.log("true 입니다."); } else { console.log("false 입니다."); } 위의 if문을 삼항연산자로 표현하면 이렇게 구성할 수 있습니다. let num = 1; num == 1 ? ( console.log("true 입니다.") ) : ( console.log("false 입니다.") ) 삼항연산자는 if else 문을 간결하게 표현해줍니다. 하지만 코드가 길어진다면 직관성..