ES6:reduce에서 array of object의 합 구할때 주의사항 (get sum of array of object) | 시작하기에 앞서js에서 loop를 돌며 array안에있는 object의 합을 구할때 reduce를 자주 쓰는데 자주 하는 실수가 있다. (나만 한건 아닐거다.. 아마)어떤 실수인지 아래에서 살펴보자!| 설명 > 잘못된 코드 (wrong code) const sum = reviewScores.reduce(function(prev, next) { return prev.score * prev.count + next.score * next.count; }); https://stackoverflow.com/questions/5732043/javascript-reduce-on-array-..
ES6 - 윤지수교수님 오프라인 강의 | ES Modules javscript의 표준적인 모듈 시스템이다.nodeJS에서나 필요했던것이 spa의 등장으로 모듈방식개발이 필요해짐.지금까지는 commonJs 표준 -> nodeJS에서 사용되던 방식을 Browser가 도입정리하면 자바스크립트 파일 복잡성 증가 -> 모듈화 ->의존성문제 ECMAScript modules 탄생 1.모듈로 불려질 javascript entry 등록2.entry에서는 의존하고있는 파일import 해서 접근 가능3.다른곳에서 사용할 모듈을 export 설정 다이나믹 로더사용자가 글을 입력했을때나 클릭했을때 빠르게 처리 ? | Classes 프로토 타입 -> 클래스로 서비스 만듬상속은 프로토타입 체인으로 연결 -> 클래스 extends..
es6 - slice() vs spilce() | Slice() slice는 배열의 일정부분을 추출해 낼때 사용한다. 그리고 아래와 같이 사용한다. arr.slice( 추출시작index, (option)추출직전index ) 예를 통해 더 자세히 알아보자.var arr=[1,2,3,4,5]; arr.slice(1); -> 결과값: [2,3,4,5]; arr.slice(0,2); -> 결과값: [1,2]; 위에서 볼수 있듯이 arr.slice(1)는 배열 index가 1인것부터 배열의 마지막index까지 추출해낸다. 그리고 추출직전index는 option이므로 꼭 넣어주지 않아도 된다.그리고 arr.slice(0,2)에서 볼수 있듯이, index가 0인것부터 index가 2 직전인 값 까지 그러니..
es6- class를 통한 객체생성
es6- class를 통한 객체생성 | es6의 클래스에 대해 알아봅시다. http://poiemaweb.com/es6-class 참고자바스크립트는 프로토타입 기반(prototype-based) 객체지향형 언어다. 비록 다른 객체지향 언어들과의 차이점에 대한 논쟁들이 있긴 하지만, 자바스크립트는 강력한 객체지향 프로그래밍 능력들을 지니고 있다.프로토타입 기반 프로그래밍은 클래스가 필요없는(class-free) 객체지향 프로그래밍 스타일로 프로토타입 체인과 클로저 등으로 객체 지향 언어의 상속, 캡슐화(정보 은닉) 등의 개념을 구현할 수 있다.우선,ES5에서는 생성자 함수와 프로토타입을 사용하여 객체 지향 프로그래밍을 구현하였다. 그리고 ES6의 클래스는 기존 프로토타입 기반 객체지향 프로그래밍보다 클래스..
es6 - Arrow function | Arrow function 활용let newArr = [1,2,3,4,5].map(function(value){ return value * 2; });아래와 위는 같다.(syntax 유지)let newArr = [1,2,3,4,5].map((value)=> value * 2);배열 map, reduce,filter 함수의 콜백에서 arrow function이 자주 사용될 수 있다. | Arrow function 의 this context arrow function의 this context 유지 속성 덕분에, bind 함수를 쓸 필요가 없어지게 된다.Ex1)const myObj ={ runTimeout(){ setTimeout(function(){ this.prin..
ES6-Destructuring 활용 json 파싱 destrucuring에 대해서 개념이 숙지되지 않은 분들은http://ideveloper2.tistory.com/47를 참고하고 오길 바랍니다.var news=[ { "title" : "sbs", "imgurl" : "http://블라블라" "newslist" : [ "test", "test2" ] }, { "title" : "mbc", "imgurl" : "http://블라블라" "newslist" : [ "test", "test2" ] }, ]; //1 let [,mbc]=news; let{title,imgurl} = mbc; console.log(title,imgurl); //2 let [,{title, imgurl}] = news; cons..
ES6-간단히 객체 생성하기, Destructuring array >간단히 객체 생성하기 function getObj(){ const name ="crong"; const getName=function(){ return name; } const setName = function(newname){ name=newname; } const printName=function(){ console.log(name); } return{ getName,setName } } var obj=getObj(); console.log(obj.getName());위와 같이 객체를 쉽게 생성할 수 있다. >Destructuring Array let data=["crong","honux","jk","jinny"]; //아래는 ..