본문 바로가기

분류 전체보기

(246)
[JS/ES6] from 메서드 (진짜 배열 만들기) from 메서드로 진짜 배열 만들기 배열 같지만 배열이 아닌 것들이 존재합니다. 예를들어 함수의 arguments 객체도 배열처럼 동작하지만 배열이 아닙니다.이런 객체를 진짜 배열로 바꿔주는 메서드가 from 입니다. function add() { let newArray = Array.from(arguments);let newData = newArray.map(function(value){return value + "~";});console.log(newData);}add(1,2,3,4,5); map은 배열에서만 상용가능한 메서드인데 arguments는 배열이 아니기 때문에 사용할 수 없습니다.from을 이용해서 진짜 배열로 동작하도록 만들고 map을 이용해서 원하는 동작을 수행할 수 있습니다.
[JS/ES6] spread operator 배열의 복사 (immutable array) spread operator를 번역하면 펼침 연산자 입니다.이 연산자는 ... 를 사용합니다.마치 String의 concat이 새로운 공간을 할당받아 이어진 문자열을 만들어 주는것 처럼,spread operator를 사용하면 새로운 공간을 할당받아 복사된 값을 가진 배열을 만듭니다. let pre = ["apple", "banana", 100]; let newData = [...pre];console.log(pre, newData);console.log(pre === newData); 물론 참조가 아닌 복사이기 때문에 === 연산자로 비교하면 false가 나옵니다. 배열을 합침 let pre = [10,20,30];let result = ['a', 'b', ...
[JS/ES6] for in의 단점, for of의 등장 for in 의 단점 먼저 객체의 한 종류인 배열을 순환하는 for문인 for in 을 알아보겠습니다.var data = [1,2,undefined,NaN,null,""]; Array.prototype.getIndex = function(){}; for(let idx in data) {console.log(data[idx]);} 결과 출력문을 예상하면 data에 들어있는 1, 2, undefined, NaN, null, "" 만 출력되어야 할 것 같은데실제로 출력해보면마지막에 함수도 찍히게 됩니다. Array의 프로토타입으로 getIndex이름의 함수를 추가해주었기 때문인데요.for in은 prototype으로 상위에 추가된(상위는 Array객체) 객체들까지도 나타내게 됩니다. 이러한 위험성 때문에 fo..
[TIL] 19.02.02 오늘 한 일인프런 es6 강의 듣기 (scope, string) 오늘 느낀 점, 생각let이 클로저를 대체할 수 있다고 했는데 클로저 자체도 뭔지 잘 몰라서 생활코딩 js 클로저부분 다시 듣고 정리했다. 더 제대로 이해하기 위해서 모르는 부분을 찾아 더 공부하게 되는 것 같다. 모르는 부분을 짚어 공부하고 또 모르니까 다른부분 찾아 공부하는 것이 마치 콜백함수같다. (vue 공부하다가 es6 듣고 es6 듣다가 closure 몰라서 closure 듣고 오고 ㅠㅠ) 내가 진짜 공부하고 싶은 것의 본질을 흐리는게 아닌가 생각도 들긴 하는데 그래도 확실히 모르면 끝까지 그부분 이해를 못할 것 같기 때문에 제대로 짚고 넘어가려고 한다. 내일 할 일es6 공부 (Array, 실습예제, Object)
[JS/ES6] 추가된 String의 메서드들 ES6에서 추가된 String의 메서드들 String.startsWith(matchString) matchString이 String의 앞부터 일치하는지 확인 (true/false) String.endsWith(matchString) matchString이 String의 뒤부터 일치하는지 확인 (true/false) String.includes(matchString) matchString이 String에 포함되어 있는지 확인(true/false) 예시let str = "hello world ~!~!"; str.startsWith("hello"); //truestr.endsWith("~!~!"); //true str.startsWith("h ello"); //falsestr.endsWith("~! ~!");..
[JS] 클로저(closure) 내부 함수function outter() {var title = 'hello world';function inner() { // var inner = function() {...} 와 같음alert(title);}inner();} outter 함수에는 지역 변수 title과 내부 함수 inner가 정의되어 있습니다.내부함수는 외부함수의 지역변수에 접근할 수 있습니다. inner() 내부함수에 title이라는 변수가 없으면 외부함수의 지역변수인 title을 출력합니다. 내부함수를 왜 쓸까?어떤 함수에서만 사용하고싶은 함수를 정의하기 위해 사용합니다. outter()에서만 쓰고싶은 inner() 함수를 정의하고 싶은데 outter 밖에서 선언할 경우 다른 코드에서 inner() 를 사용할 수 있습니다. 응집..
[TIL] 19.02.01 오늘 한 일vue-router 까지 다시 프로젝트 파서 실습하기git flow를 프로젝트에 적용해보기3. API 통신 강의 듣기 오늘 느낀 점, 생각점점 강의를 들을수록 이해가 안가는데 억지로 이해하고(하는척?) 넘기는 기분이다. 이렇게 하면 어차피 머리에 남는게 없음.. 잠시 중단하고 js es6 문법과 vue 기초부분을 습득하는 것도 나쁘지 않을 것 같다.git flow가 머리로는 이해되는데 실제로 적용하려니 헷갈리는부분이 많다. 언제 커밋을 하고 푸시해서 원격저장소에 옮기고 하는지 아직은 잘 모르겠다. 일단 연습용이고 혼자 시도해보는거니까 develop에서 feature 기능 브랜치 파고 기능 완료 -> develop 머지 -> 푸쉬 하는 방식으로 해봐야지. 내일 할 일es6 공부
[Git] git GUI SourceTree 터미널에서 열기 git GUI SourceTree 커맨드 창에서 열기 일단 source tree가 설치되어있다고 가정한 후 진행합니다. 터미널에 아래 명령어를 복붙합니다. alias stree='/Applications/SourceTree.app/Contents/Resources/stree' 이후 stree 라고 치면 해당 프로젝트를 담은 source tree가 열립니다.