본문 바로가기

분류 전체보기

 (293)
단축평가값(circuite evaluation) const result = 0 || 40 || 60; console.log(result);//40 falsy truthy truthy const result2 = 0 || '' || 60; console.log(result2);//60 논리 연산자들은 왼쪽 > 오른쪽으로 실행됌. 이 연산자들은 결과를 얻게 되면 평가를 중단함. and 연산자에서는 false를 첫번째로, or 연산자에서는 true를 첫번째로 작성하는 것이 유용함
삼항연산자 const grade =55; const result = (grade>80)?'distingction' :(grade>50) ? 'pass' : 'fail'; console.log(result)//pass if / else 문을 대체하는 삼항연산자가 return을 여러 번 사용하고 if 블록 내부에서 한줄만 나올때 return을 대체 할 수 있음. if else if else 구문으로도 작성 가능 developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Conditional_Operator
배열구조분해할당(destructing) let numbers=[10,22,33]; let [one, two,three,six = 80] = numbers; console.log(three);//33 console.log(six);//80 default value function bottle(){ return ['bottle','water']; } let[red,blue] = bottle(); console.log(red);//bottole
css grid 반응형 예제 grid 사용방법 .content_inner{ width:90%; max-width:1240px; margin:0 auto; display:grid; grid-template-columns:1fr;/*자연스럽게 500이하의 css 값이됨*/ grid-template-rows:auto; grid-gap:20px; } /*500이상일때는 2등분*/ @media screen and (min-width:500px){ .content_inner{ grid-template-columns:1fr 1fr; } .desc.first{ /*500이상일때 첫번째 아이템이 첫번째 컬럼부터 세번째 컬럼까지(2칸)사용*/ grid-column:1/3; } } /*800이상일때는 4등분*/ @media screen and (min..
객체구조분해할당(destructing) 예시 const person ={ name : 'Domenic', age:21 }; let{name,age,gender='Unknwon'} = person; //console.log(name);//Domenic //console.log(gender); //Unknwon //다음과 같은 방식으로 함수내 매개변수에 지정할 수 있다. function printDetails({name,age}){ console.log(`이름은 ${name}이고 나이는${age}이다`); } printDetails(person); //"이름은 Domenic이고 나이는21이다" 구조분해할당: 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 JavaScript 표현식 var a, b, rest; [a, b] = ..
switch 열거문 const Direction = { UP:'UP', DOWN:'DOWN', LEFT:'LEFT', RIGHT:'RIGHT' }; function sayDirection(direction){ switch(direction){ case Direction.UP : console.log('we are going up'); break; case Direction.DOWN : console.log('we are going down'); break; case Direction.LEFT : console.log('we are going left'); break; case Direction.RIGHT : console.log('we are going right'); break; } }; sayDirection(Direc..
Map object let zoo = new Map(); zoo.set('ZZebra',5); zoo.set('Gorilla',7); zoo.set('Monkey',10); console.log(zoo); //{"ZZebra" => 5, "Gorilla" => 7, "Monkey" => 10} let zebraCount = zoo.get('ZZebra'); console.log(zebraCount);//5 var myMap = new Map(); // Add new elements to the map myMap.set('bar', 'foo'); myMap.set(1, 'foobar'); // Update an element in the map myMap.set('bar', 'baz'); get과 set을 사용하여 Map을 ..
reduce함수를 이용한 전체 합 구하기 let numbers = [1,2,3,4,5] let total = numbers.reduce(function(acc,cur){ return acc + cur }); console.log(total);//15 let total = [{qunt: 1}, {qunt: 2}, {qunt: 1}].reduce( (acc, cur) => acc + cur.quntity , 0 ) console.log(total) // 결과값: 4 let max = [1, 2, 3, 4, 5].reduce( ( max, cur ) => Math.max( max, cur ) ); console.log(max) // 결과값: 5 reduce 함수는 네개의 인수를 사용한다. Accumulator(누적값) Current Value(배열의..

티스토리툴바