Phot_o_matic Programming

module의 import와 export 방법을 알아보자. 구성은 모듈을 작동시키는 app.js와 모듈 파일로 나뉜다. 각 모듈은 현재 시간을 호출하는 것(getCurrentTime)과 콘솔에 로그를 찍어주는 역할(logging)을 하는 모듈로 구분한다. app.js import timing from './getCurrentTime'; // default로 export된 것은 이름으로 import 한다. import {_} from './logging'; // default로 export 된 것이 아니면 {} 안에 입력해서 import 한다. const test = new timing(); _.log(`It is ${test.getCurrentHour()}`) _.log(`Now is ${test.get..

Programming/Concept 2019. 4. 25. 19:16

Object assign method const healthObj = { showHealth : function() { console.log("오늘 운동시간 : " + this.healthTime) } } const myHealth = Object.create(healthObj); myHealth.healthTime = "10:30"; myHealth.name = "sangwoo"; console.log(myHealth); //myHealth가 일반 객체가 아니라 prototype 객체 안에 포함됨. Object.Prototype.----이런식으로 작성하지 않아도 됨. //문제는 .healthTIme .name 처럼 일일히 다 지정해줘야 함 Object assign 방법 const healthObj = ..

Programming/Concept 2019. 4. 23. 20:36

Javascript에는 class가 없지만, ES6에서는 class라는 keyword가 생겨서 사용할 수 있게 되었다. 기존의 this context 방법 function Health(name) { this.name = name; } Health.prototype.showHealth = function() { console.log(this.name + "님 안녕하세요"); } const h = new Health("sangwoo"); h.showHealth(); // "sangwoo님 안녕하세요" class 방법 -> 실제로는 위의 방법과 같은 원리도 작동하는 것 class Health { constructor (name, lastTime) { this.name = name; this.lastTime =..

Programming/Concept 2019. 4. 23. 19:41

기존 방법으로는 어떤 arguments들에 대한 판별이 필요할 때 아래와 같은 방법을 사용하였다. //arguments가 전부 숫자로만 이루어져있는지 판별하는 함수 checkNum function checkNum() { const argArray = Array.prototype.slice.call(arguments); console.log(toString.call(argArray)); // Array const result = argArray.every(v => typeof v === "number") // every method는 array의 element들이 해당 조건을 모두 만족하면 true, 아니면 false를 return한다 console.log(result); } const result = c..

Programming/Concept 2019. 4. 23. 19:21

function sum(value, size) { return value * size; } console.log(sum(3, 10)) // 30 console.log(sum(3)) // NaN 위처럼 두번째 parameter 값을 입력하지 않은 경우에는 NaN과 같은 값이 나올 수 있다. 이런 경우, 두번째 parameter 값이 입력되지 않을 경우에 기본값(default parameter)을 지정해 줄 수 있다. //아래의 방법과 같이 쓸 수도 있다. function sum(value, size) { size = size || 1 ; return value * size; } //더 간단히 하면, function sum(value, size=1) { return value * size; } default..

Programming/Concept 2019. 4. 23. 19:04

codestates pre course 과제 중, lodash method를 하나씩 구현하는 과제가 있었다. 그 중에 IAT 문제로 나왔던 _.reduce 구현이 까다로웠던 것으로 기억해 정리해보았다. each each는 object 또는 array 전체를 순회하는 method이다. return 값은 따로 없다. //Call iterator(value, key, collection) for each element of collection. //collection은 주어진 object, iterator는 collection 길이만큼 순회하는 함수. _.each = function(collection, iterator) { if(Array.isArray(collection) { for(var i = 0; i..

Programming/Concept 2019. 4. 22. 16:34

문제의 개요 express 설정 필요한 npm 모듈의 설치 input UI 만들기 (검색창) 검색결과를 서버에서 받아 dummy json 형태를 내려주기 화면에 결과를 노출하기 https://github.com/swoo1226/myproject/commit/b2d24a840cdfba333c37440e7b713213b20aaebd

Programming/Concept 2019. 4. 21. 23:18

기존의 방법으로 사용된 this context const myObj = { runTimeout(){ setTimeout(function(){ this.printData(); }.bind(this), 2000); }, //여기서 bind를 통해서 window 내의 printData를 찾는 것이 아닌, myObj 내에서 찾도록 만들어준다. printData(){ console.log("Hello ES6!"); } } Arrow funciton의 적용 const myObj = { runTimeout(){ setTimeout(() => { console.log(this === window); this.printData(); }, 2000); }, //bind가 없어지고, Arrow가 포함되는 이 때에는 this..

Programming/Concept 2019. 4. 19. 17:46