대가는 결과를 만든다

맨날 햇갈려서 메모겸 기록한다. const test1 = value || '1'const test2 = value ?? '1' || 는 value가 falsy한 값(null, undefiend, 0, '', NaN, false 등)인 경우 모두 '1' 출력??는 value가 null, undefined일 경우에만 '1'출력

1. input Event- 사용자가 값을 수정할 때마다(되자마자) 이벤트 발생- 키보드가 아닌 다른 수단을 사용하여 값을 변경할 때도 발생함-  ⇦, ⇨ 키와 같이 값을 변경시키지 않는 키보드 입력에는 이벤트 발생하지 않음- event.preventDefault()를 사용해도 아무런 효과가 없음 2. change Event- 기본적으로는 요소의 변경이 끝날 때 발생하지만,  input text 에서는 포커스를 잃을 때 이벤트가 발생- select, input checkbox/radio는 선택값이 변경된 직후에 이벤트가 발생함 참고 https://ko.javascript.info/events-change-input

javascript에는 'Number, String, Boolean, Null, Undefined 등'의 원시타입이 있고 'Object, Symbol'의 참조타입이 있다. 1. 원시타입의 복사원시타입의 경우 값을 복사하는 경우 해당 값을 다른 독립적인 메모리 공간에 할당하므로, 복사 값이 원본 값에 영향을 주지 않는 깊은 복사가 수행된다. 2. 얕은 복사참조타입은 참조를 공유하는 복사인 얕은 복사를 하는 경우 복사본의 최상위 속성을 재할당해도 원본 객체에 영향을 끼치지는 않지만, 중첩 객체 속성을 재할당하면 원본 객체에 영향을 끼친다. 얕은 복사를 수행하는 코드 : ...전개연산자, Array.prototype.concat(), Array.prototype.slice(), Array.from(), Obj..

이벤트 정의 함수 내에서 자주 쓰게되는 객체들 간단히 정리해본다. ELEMENT.addEventListener('click', function (e){ console.log(this); //event listener를 추가하는 dom element 객체 console.log(e.currentTarget);//위의 this와 동일 console.log(e.target);//클릭한 dom element 객체 console.log(this.parentNode);//클릭한 dom element의 부모 객체 }) 이어서 많이 사용하는 addEventListener의 이벤트 위임에 대해 정리한다. - addEventListener를 dom에 많이 부여할 수록 메모리를 차지하므로 페이지 성능에 영향을 줄 수 있다. ..

아래의 예시와 같이 사용할 수 있다. window.scrollTop=0; this.$refs['something'].$el.scrollTop=0; document.getElementId('something').scrollTop=0;

안녕 위 p tag의 class에 b라는 class을 추가, 제거, 토글 하기 const aDom = document.querySelector('.a'); aDom.classList.add('b'); // => 안녕 //!!아래와 같이하면 아예 대체되버린다.!! aDom.className='b'; // => 안녕 //제거 aDom.classList.remove('b'); //토글 : 있으면 제거, 없으면 추가한다. aDom.classList.toggle('b');

1. 스코프란? - scope란 사전적 의미로 '범위'라는 의미를 지닌다. - 자바스크립트에서 변수에 접근할 수 있는 범위 혹은 변수가 영향을 끼칠 수 있는 범위라고 생각하면 된다. - 크게 나누면 전역, 지역 스코프로 나눌 수 있지만 스코프 레벨을 좀더 자세하게 나누자면, 함수 레벨 스코프, 블록 레벨 스코프(ES6), 렉시컬 스코프로 나눌 수 있다. 1-1. 함수레벨 스코프 - 자바스크립트에서 var 키워드로 선언된 변수, 함수 선언식으로 만들어진 함수는 함수 레벨 스코프를 지닌다. - 변수는 함수 내부 전체에서(만) 유효한 식별자가 된다. 1-2. 블록 레벨 스코프 - ES6의 let, const 키워드는 블록레벨 스코프 변수를 만들어 준다. - 여기서 블록이란 if/else, while/for 내..

이터러블/이터레이터 이터러블/이터레이터 프로토콜 : 이터러블을 ES6의 for...of, 전개 연산자 등으로 동작하도록한 규약이다. 오픈소스나 브라우저에서 이 규약을 통해 ES6의 문법을 사용할 수 있도록 이터러블/이터레이터 프로토콜로 구현되어져 있는 부분들이 많이 있다. 예) immutable.js나 브라우저 dom API 등.. 1. 이터러블 : 이터레이터를 리턴하는 [Symbol.iterator]( )를 가진 값 //iteraable iterable = { [Symbol.iterator](){ return iterator; } } 2. 이터레이터 : {value, done} 객체를 리턴하는 next( )를 가진 값 iterator = { next(){ return i==0 ? {done:true} ..