[JavaScript] 콘솔로 입력받기
·
JavaScript
자바스크립트를 하면 콘솔로 입력 받을 경우가 많지는 않다. ( 아닐수도 있지만 본인이 느끼기엔 ㅋㅋ ) 막상 필요해서 어떤 방식으로 구현할까 고민하던 중에 readline 이라는 패키지를 찾았다. const readline = require('readline'); const rl = redline.createInterface({ input: process.stdin, output: process.stdout }); rl.question('What do you think of Node.js? ', (answer) => { console.log(`Thank you for your valueable feedback: ${answer}`); rl.close(); }); 간단하게 콘솔을 통해서 데이터를 입력 받을..
객체 정렬하기
·
JavaScript
코딩을 하다보면 빈번하게 객체를 정리 해야하는 경우를 만나게 된다. 배열의 경우엔 Sort 함수를 사용하면 되지만 객체의 경우엔 몇 가지 제약이 있다. 기본적으로 Object를 저장형 데이터로 사용할 경우에는 Object를 사용하기 보단 Map을 사용하는 것이 좋다. 어쩔수 없이 Object를 사용하는데 정렬이 필요할 때 참고 바랍니다! 다양한 해결 방법이 있었는데, 그중 하나를 정리한다. let object = { a : 20, b : 30, c : 40, d : 35, } 형식의 객체가 있다고 했을 때 Value를 기준으로 정리하는 방식이다. const sortObject = []; for(const item in object) { sortObject.push([item, object[item]]);..
[JavaScript] 일반 함수 vs 화살표 함수
·
JavaScript
Array Function? 화살표 함수는 ES6에서 새롭게 추가되었다. function fun () { // 일반 함수 // ... } const arrFun = () => { // 화살표 함수 // ... } 화살표 함수 vs 일반 함수 1. this 여기서 바인딩이란 말이 많이 나올텐데, 바인딩이란 함수 호출과 실제 함수를 연결하는 방법이다. 동적 바인딩과 정적 바인딩으로 구분이 가능한데, 동적 바인딩은 실행 시간에 이루어지거나 실행 시간에 변경된다. 정적 바인딩은 실행 시간 전에 일어난다. 실행 시간에는 변하지 않는 상태로 유지된다. 일반 함수 자바스크립트에서 함수는 실행될 때마다 함수 내부에 this라는 객체가 추가된다. 일반 함수에서 this가 바인딩 되는 상황이 3가지가 있는데, 1. 함수 ..
[JavaScript] 원하는 크기의 2차원 배열 만들기
·
JavaScript
0. 들어가며 자바스크립트로 개발을 하다 보면 배열이 5개의 배열을 가지고 있는 형식으로 만들 때가 있다. 예를 들어 제공되는 것이 " N : 3 "이 끝이고 배열이 3개의 배열을 가지고 있는 이차원 배열을 만들 때가 있다. 그럴 경우, const arr = []; for(let i = 0; i [] ); 이렇게 사용하면 간단하게 원하는 사이즈의 2차원 배열을 만들 수 있다.
[JavaScript] ==과 === 차이
·
JavaScript
자바스크립트에는 눈으로 보기엔 비슷하지만, 매우 다른 동등 비교연산자가 두개 있다. 바로 == 와 ===이다. === 동등 비교연산자 자바스크립트에서 === 연산을 사용할 때, 엄격한 동등성을 비교한다. 엄격한 동등성이란 타입과 값이 둘 다 같아야 한다는 이야기다. 5 === 5 // true 숫자 5 두개를 비교했다. 둘다 숫자 타입이며 5라는 같은 값을 가지고 있어 true가 반환되었다. 55 === "55" // false 숫자 55와 문자열 55를 비교해보았다. 두 개의 피연산자는 같은 값을 가지고 있지만 다른 타입을 가지고 있다. 즉, ===은 타입과 값이 모두 같아야지만 true를 반환한다. == 동등 비교연산자 자바스크립트에서 == 연산자를 쓰는 목적은 느슨한 동등 비교를 위함이다. == 연..
[JavaScript] 암묵적 타입 변환
·
JavaScript
암묵적 타입 변환 ( Implicit coercion ) 간단하게 말하면 예상치 못한 타입을 받았을 때 예상 가능한 타입으로 바꿔준다고 생각하면 된다. 사용자는 숫자 값을 넘겨야 하는 곳에 문자열을 넣을 수 있고, 문자열을 넣어야 하는 곳에 객체를 넣을 수 있다. 이런 일이 발생했을 때 자바스크립트 엔진을 사용자가 잘못 넣은 타입을 올바른 타입으로 변환하려는 시도를 한다. 자바스크립트의 주요한 기능 중 하나이지만 가장 피해야 할 기능이다. 3 * "3" // 9 1 + "2 + 1 // 121 true + true // 2 10 - true // 9 const foo = { valueOf: () => 2 } 3 + foo // 5 4 * foo // 8 const bar = { toString: () =..
[JavaScript] 자바스크립트의 원시 타입
·
JavaScript
기초 자바스크립트에는 6가지 원시 데이터 타입이 있다. 원시 데이터 타입이란 자바스크립트에서 객체가 아닌 것을 말하면 값 그대로 저장된 것을 말한다. Booleans : true or false null undefined number string symbol 6가지 원시 타입에 ECMAScript 표준은 Object를 정의했다. Object는 키-값 저장소이다. const object = { key: "value" } 즉, 원시 타입( Primitive Type )이 아닌 것은 Object이다. 여기에는 함수와 배열도 포함이다. // Primitive Types true instanseof Object; // false => boolean numm instanseof Object; // false => ..
[JavaScript] Destructuring 문법
·
JavaScript
자바스크립트에서 array, object 안에 있는 데이터를 빼서 변수로 만들고 싶을 때 쓰는 문법이 있다. let person = { name : "abc", age : 13 } let name = person.name; let age = person.age; 그냥 객체명.속성 방식으로 데이터를 뺄 수 있지만, 간단하게 뺄 수 있도록 도와주는 것이 Desctructuring 문법이다. let person = { name : "abc", age: 13 } let { name, age } = person; 간단하게 객체의 속성을 빼낼 수 있는 문법이다. 가능하면 변수의 명칭을 객체의 속성명으로 작명하는 게 가독성이 좋지만, 반드시 같을 필요는 없으며, array destructuring 할 때는 변수 명칭..