본문 바로가기

Front-end/Web57

[JS] 자바스크립트 프로처럼 쓰는 팁 Ternary Operator - 2가지 경우로 나뉘는 경우에는 Ternary Operatior 사용하기 // Ternary Operator // ❌ Bad Code 💩 function getResult(score) { let result; if (score > 5) { result = '👍'; } else if (score 5 ? '👍' : '👎'; } console.log(getResult(6)); console.log(getResult(5)); Nullish Coalescing - ??의 사용 : null, undefined 일 때 해당 - Default Parametersms undefined 일 때만 해당된다. // Nullish coalescing operator // ❌ Bad Code 💩 .. 2021. 8. 31.
[JS] 최신문법 (ES6, ES11) ES6 Shorthand property names /** * Shorthand property names * https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Object_initializer * */ { const ellie1 = { name: 'Ellie', age: '18', }; const name = 'Ellie'; const age = '18'; // 💩 const ellie2 = { name: name, //Ellie age: age, //18 }; // ✨ 축약해서 코드 작성 가능 const ellie3 = { name, age, }; console.log(ellie1, ellie2, ellie3); cons.. 2021. 8. 31.
[JS] 자바스크립트 기초 4. 클래스 | 클래스 예제와 callback함수 정리 클래스와 callback 'use strict'; class Counter{ constructor(runEveryFiveTimes){ this.counter = 0; this.callback = runEveryFiveTimes; } increase(){ this.counter++; console.log(this.counter); if(this.counter % 5 === 0){ this.callback && this.callback(this.counter); //위의 코드와 같음 // if (this.callback){ // this.callback(this.counter); // } } } } const coolCounter = new Counter(); coolCounter.increase(); co.. 2021. 8. 29.
[JS] 자바스크립트 기초 3. 연산자 | boolean, &&연산자 true와 false //false : 0, -0 , '' , null, undifined //true : -1 , 'hello' , 'false' let num; if (num){ //undifined console.log('true!'); } else { console.log('false!'); } &&연산자 let obj = { name : 'hellozo0', } obj && console.log(obj.name); //hellozo0 2021. 8. 29.
[JS] 자바스크립트 기초 2. 함수 | 함수 정의, 호출, 그리고 callback 함수 정의 //함수는 반복되는 코드들을 짧게 만들어줌, 재사용 가능 const num1 = 1; const num2 = 2; const result = num1 + num2; console.log(result); //3 const num3 = 1; const num4 = 2; const result2 = num3 + num4; console.log(result); //3 function add(a,b) { return a + b; } 함수 호출 🌟함수의 이름만 전달 하는 것은 함수의 레퍼런스를 전달하는 것이다🌟 //함수 호출 function add(a,b) { return a + b; } const sum = add(3,4); console.log(sum); //7 const doSomething = a.. 2021. 8. 28.
[JS] 자바스크립트 기초1. 변수 | primitive 타입과 object의 차이점 Primitive Type 'use strict'; // Primitive : 가장 작은 단위의 변수 : number, string, boolean, null, undefined let number = 2; let number2 = number; //number2에 값에 number1의 값이 복사 console.log(number); // 2 console.log(number2); // 2 number2 = 3; console.log(number); // 2 console.log(number2); // 3 Object //Object : 여러타입들을 한곳에 묶어둔것 : primitive를 제외한 모든 것 //const 값을 바꿀 수 없음 const obj = { name : 'ellie', age : 5.. 2021. 8. 28.