eunas blog

쓸 때 마다 찾아야해서 헷갈림 일단 여기에 모아놓고, 계속 추가 예정 0. 공통 데이터 포맷 유형 (YYYY-MM-DD) const getFormatDate = (date) => { let month = date.getMonth() + 1; month = month >= 10 ? month : '0' + month; let day = date.getDate(); day = day >= 10 ? day : '0' + day; return date.getFullYear() + '-' + month + '-' + day; } 1. 오늘 getFormatDate(new Date()) 2. 올해 1월 1일 getFormatDate(new Date(state.now.setFullYear(state.now.getFu..

Set 1. 중복 값이 없는 유일한 값들의 집합 2. 순서에 의미가 없음 3. index로 접근 불가 1. Set 객체 생성 const set = new Set(); console.log(set); //Set(0) {} const set1 = new Set([1, 2]); //Set(2) {1,2} const set2 = new Set('hello'); //Set(4) {"h", "e", "l", "o"} ※ 배열의 중복제거 기능으로 사용 //기존 const uniq = array => array.filter((v, i, self) => self.indexOf(v) === i); console.log(uniq([1, 1, 2, 2, 3])); // [1, 2, 3] //Set이용 const uniq = ..

/** * 3개의 타입 중, 2개의 타입 선택 시 해당 name 값 join을 이용해 하나의 문자열로 뽑아오기 */ const types =[ {name : '추천', value : 1}, {name : '묶음', value : 2}, {name : '단일', value : 3} ]; const values = [1, 2]; let arr = []; for(let i in values) { const data = types.filter((item) => item.value === values[i]).map(item => item.name); for(let n in data) { arr.push(data[n]); } } console.log(arr.join()); // "추천,묶음"

자주 헷갈려서 참조형은 아묻따 JSON.parse()와 JSON.stringify()를 이용하여 깊은 복사를 해왔는데 이 방법은 문제가 발생 할 여지가 있다고 한다. 아래에 같이 이야기하겠다. 객체는 참조형이라 복사 시, '='를 이용하면 값이 복사되지 않으며, 단지 메모리 주소 값을 복사하여 같은 메모리를 공유하게 된다. 원본 데이터를 건들 수 있기 때문에 매우 주의하여야 한다. ■ 얕은 복사(Shallow Copy) 1. Object.assign(target, ...sources) 객체 자체는 깊은 복사가 가능하다. 단, 객체가 2차원 이상이라면 얕은 복사가 된다. let obj = { a: 1, b: { c: 2 } }; let copyObj = Object.assign({}, obj); conso..

const arr = [{a:1, b:2, c:3}, {a:4, b:5, c:6}]; { a: 5, b: 7, c: 9 } const arr = [{a:1, b:2, c:3}, {a:4, b:5, c:6}]; const result = arr.reduce((acc, cur) => { acc.a += cur.a; acc.b += cur.b; acc.c += cur.c; return acc; }, {a:0, b:0, c:0}); const arr = [ { key: 100, alphabet: [{ a: 1, b: 2, c: 3 }] }, { key: 200, alphabet: [{ a: 4, b: 5, c: 6 }] }, ]; { a: 5, b: 7, c: 9 } let rsltObj = {}; for (c..

input 태그에 number 타입의 데이터를 입력함에 따라 타 컬럼의 데이터가 계산되어야하는 경우, 해당 input box에는 string 타입의 데이터가 들어오면 안된다. @input 태그를 써서 데이터 변경을 감지하고, 그때그때 계산을 해주기 때문에 string이 들어오면 바로 NaN 값이 되어버리므로, 다시 number를 입력해도 NaN이 되어버렸기 때문에 계산이 불가하다. 결론은, input 박스에 잠깐이라도 string이 입력되어서는 안되는 상황 보통 이렇게 type을 number로 주는 경우가 많은데, 이건 잠깐이나마 string 값이 입력된 후 사라지기 때문에 @input에 감지된다. type을 text로 바꾸고, oninput에 정규식을 넣어 숫자가 아닌 값이 입력되는 경우 replace..

ES6 1. const and let 새로운 변수 키워드 const - var보다 강력하고, 변수를 재할당할 수 없다. let - const와 달리 변수 재할당 가능 2. Arrow functions(화살표 함수) ES5 function func(name) { return '내 이름은' + name; } console.log(func('kea')); //내 이름은 kea ES6 const func = (name) => { return `내 이름은 ${name}`; } const func = (name) => `안녕 ${name}`; console.log(func('kea')); //내 이름은 kea map, filter, reduce 등 내장 함수와 사용이 가능하다. ES5 const arr = ['바나..

캡틴판교님의 자바스크립트 기본 다지기 글을 참조하여 공부하며 끄적인 기록입니다. 자바스크립트 타입 1. Number - 실수 2. String - 문자열 3. Boolean 4. undefined - 변수에 값이 할당되기 전 값이자 타입 5. null - 개발자가 의도적으로 할당하는 값. 타입은 Object으로 반환 1. Object 2. Array 3. Function NaN? 정상적 값을 얻지 못할 때 발생하는 에러 예시) 프로퍼티명이 연산자 포함하여 에러 delete 연산자 객체 프로퍼티 삭제. 단, 객체 삭제 불가! 객체의 모든 연산은 참조 값으로 처리함 Array와 Object의 구분 delete, splice 연산자와 배열 typeof var num = 10; var str = "a"; var..

function a() { if(!(this instanceof arguments.callee)) { return new a(); } } 1. function function도 하나의 객체이다. 2. this, new this는 함수의 호출자를 가리킨다. 즉시실행함수처럼 앞에 호출자가 없다면, 기본적으로 window 객체를 가리킨다. 함수 선언 시, 앞에 new가 붙고 안붙고는 완전 다른 결과를 부른다. a(); //a 함수 속 this는 window 객체를 가리킨다. var func = a(); //a 함수 속 this는 window 객체를 가리킨다. (참고 func; 를 하면, a()가 실행된다.) new a(); //a 함수 속 this는 새로 생성된 객체를 가리킨다. var func = new a..

Javascript에서의 this는 Java보다 더 다양한 동작방식으로 이루어진다. var info = {name: "euna"} this.name은 euna가 출력되어진다. 변수 info는 this가 바라보는 객체가 된다. this의 동작 방식들 우선, this를 콘솔 로그로 찍어보자 this는 전역 객체를 바라보는 값으로 갖는다. (여기서는 window 객체) console.log(this); 일반 함수에서의 This : 일반함수에서는 전역 객체인 window가 저장 일반 중첩 함수에서의 This : 위와 동일 Events Listener에서의 This : this는 이벤트를 발생시킨 객체 메소드에서의 This : 객체 자신이 저장 메소드 : 객체를 통해 수행 (java로 따지면 class에 종속된 ..