Fall in IT.

안녕하세요. 오늘은 JavaScript에서 유용하게 사용되는 null 병합 연산자(nullish coalescing operator)에 대하여 알아보겠습니다. null 병합 연산자(nullish coalescing operator)란? 짧은 문법으로 여러 피연산자 중 값이 확정되어 있는 변수를 쉽게 찾을 수 있도록 도와주는 연산자이다. 예제 1 변수 a와 b가 있을때 a가 null이나 undefined가 아니면 a를 그 외의 경우는 b를 대입하는 경우를 생각해보자 // null 병합 연산자 사용 안했을경우 let result = (a !== null && a!== undefined) ? a : b // or let result = a ? a : b // null 병합 연산자 사용한 경우 let resul..

안녕하세요. 오늘은 자바스크립트 개발을 하다보면 보게되는 파일인 package-lock.json, yarn.lock 파일에 대해서 알아보겠습니다. package.json 파일은 무엇인가? package.json 파일은 프로젝트에서 사용된 패키지 의존성 관리를 도와준다. 자바스크립트에서는 패키지 매니저로 npm 또는 yarn을 사용한다. (패키지 매니저는 자바스크립트 프로젝트에서 특정 패키지를 설치하거나 삭제하는데 사용되는 도구를 말한다.) 이때, 설치된 패키지들의 종류와 버전이 package.json 파일에 적혀서 관리된다. 그렇다면 package-lock.json 파일은 무엇인가? 패키지 설치시점과 상관없이 모두 동일한 패키지를 설치할 수 있도록 도와준다. (이를 패키지 잠금 기능이라고 부른다) pac..

function main() { console.log("main start"); console.time("sumFunction"); sum(1, 1000000); console.timeEnd("sumFunction"); /** * OUTPUT * - PC의 상태에 따라 차이가 있을 수 있습니다. * * $ main start * $ sumFunction: 4.050ms */ } /** * 정수 a부터 b까지 더한값을 리턴하는 함수 * @param {*} a * @param {*} b */ function sum(a, b) { let sum = 0; for (let i = a; i < b; i++) { sum += i; } return sum } main();

안녕하세요. 오늘은 배열 안에 Object 형태의 원소가 담겨 있을때 특정 값이 배열 안에 있는지 확인하는 방법에 대해서 알아보도록 하겠습니다. 코드 /** * Array의 Object 형태의 Elements 사이에 원하는 Element 찾는 방법 */ function main(studyClass: IStudyClass): void { /** * 학급에 `동백이`라는 학생이 있는지 확인하는 방법 * array의 내장객체인 map을 사용한다. */ // includes로 확인할 경우 boolean let flag: boolean = studyClass.students .map((student: IStudent) => student.name) .includes("동백이"); // expected output..

안녕하세요. 오늘은 자바스크립트의 Array 객체의 내장함수 sort()에 대해서 알아보겠습니다. sort() 내장함수에는 파라미터가 Optional하게 들어갑니다. 구체적인 비교가 필요할 경우 compareFunction을 작성하여 넣어주면 됩니다. 코드 (TypeScript) /** * 자바스크립트 Array 객체의 내장 함수 sort() * * sort() 내장함수에는 파라미터가 Optional(compareFunction)하게 들어간다. * 구체적인 비교가 필요할 경우 compareFunction을 작성하여 넣어주면 된다. * * compareFunction(a, b) * - 리턴값이 0보다 작은 경우 a를 b보다 앞으로 정렬 * - 리턴값이 0보다 큰 경우 b를 a보다 앞으로 정렬 * - 리턴값..

안녕하세요. 오늘은 Javascript에서 객체를 복사하는 방법에 대해서 알아보겠습니다. 객체를 복사하는 방법에는 얕은 복사 방법이있고 깊은 복사 방법이 있습니다. 얕은 복사와 깊은 복사 얕은 복사란, 객체의 첫 번째 부분만 복사하는 것을 의미합니다. Object의 내장객체인 assign() 함수를 사용하여 구현합니다. 깊은 복사란, nested한 객체의 모든 하위 객체까지 복사하는 것을 말합니다. JSON.parse()와 JSON.stringify() 함수를 사용하여 구현합니다. 코드 /** * 얕은 복사 * * @param {*} obj */ function shallowObjectCopy(obj) { let copyObj = {}; Object.assign(copyObj, obj) return co..

Javascript의 Array 내장객체인 shift, unshift, push, pop에 대해서 알아보겠습니다. 코드 /** * shift() & pop() * * shift: 배열의 가장 첫 번째 원소를 제거하고 제거된 요소를 반환 * pop: 배열의 가장 마지막 원소를 제거하고 제거된 요소를 반환 */ let arr = [1, 2, 3]; let firstElement = arr.shift(); console.log(firstElement); // expected output: 1 console.log(arr); // expected output: [2, 3] let lastElement = arr.pop(); console.log(lastElement); // expected output: 3 c..

자바스크립트의 배열에서 특정 원소가 포함 되어있는지 확인하는 방법 // Sample Code let arr = [1, 1, 2, 3, 5, 8, 13, 21, 34, 55]; /** * # 1. Use indexOf() * 해당 원소의 index 값도 필요할 경우에 사용 */ console.log(arr.indexOf(2)); // 2 console.log(arr.indexOf(4)); // -1 /** * # 2. Use includes() * 간단히 값의 유무만 확인하는 경우에 사용 */ console.log(arr.includes(2)); // true console.log(arr.includes(4)); // false 참조 https://developer.mozilla.org/ko/docs/We..

문제 자바스크립트의 Number객체의 내장 함수인 toString() 함수와 전역 함수인 parseInt() 함수를 사용하면, 진수변환을 간단하게 처리할 수 있습니다. 사용 방법 /** * 진수 변환 * * 10진수를 진수 변환할때는 Number객체의 내장 함수인 toString()을 사용한다. * 10진수 외의 다른 진수를 10진수로 변환할때는 전역 함수인 parseInt()을 사용한다. */ // 1. 10진수 -> 2진수 let 십진수 = 125; console.log(`1. 10진수(${십진수}) -> 2진수(${십진수.toString(2)})`); // 1111101 // 2. 10진수 -> 8진수 console.log(`2. 10진수(${십진수}) -> 8진수(${십진수.toString(8)}..

안녕하세요. 오늘은 자바스크립트의 배열에서 중복값을 제거하는 다양한 방법에 대해서 알아보도록 하겠습니다. 코드 /** * 배열의 중복값을 제거하는 다양한 방법 * 1. `Set` * 2. `Filter` * 3. `Reduce` * * @param arr */ function solution(arr) { // # 1. Set let set = new Set([...arr]); //expected output: [1, 3, 5, 2, 4] console.log([...set]); // # 2. Filter let ret = arr.filter((item, index) => arr.indexOf(item) === index); //expected output: [1, 3, 5, 2, 4] console.lo..