1. (ES5) Object.create(부모객체)를 통한 상속 var parent = { name : 'Kim', age : 50 }; var child = Object.create(parent);// parent로부터 상속 var grandchild = Object.create(child)// child로부터 상속 예시로 든 코드가 별로 복잡하지 않지만 ES5에서 상속은 굉장히 복잡하고, 사실 상속이라기보다 prototype chaining에 의한 참조에 가깝다. 2. (ES6) Class를 통한 상속 class parent { constructor(name, age) { this.name = name; this.age = age; this.inConstructor = function () { con..

자바스크립트에서 this의 뜻은 사용하는 위치(스코프)에 따라 다음의 4개의 뜻을 갖는다. 1. 그냥 쓴 경우 or 일반 함수 안에서 그냥 쓴 경우 => window 객체 * 참고로 'use strict'를 써서 엄격 모드이면서, 일반 함수 안에서 쓰면 undefined가 된다. console.log(this);// 그냥 쓴 경우: { window } (엄격 모드면 undefined) [1,2,3,4].forEach(function (element) { console.log(this);// 일반 함수 내에서 쓴 경우: { window } (엄격 모드면 undefined) }); 2. 객체의 메소드 안에서 쓴 경우 => 메소드의 주인인 객체 var object = { printThis() { console..

TODOLIST - 04 CHECK FINISHED LIST ADD A LIST SET PRIORITY DELETE & CLEAR LIST CHECK FINISHED LIST finishList() ✔ 저번 포스팅에서 삭제 버튼을 추가하면서 체크 버튼도 함께 추가하였다. 이 버튼을 클릭하면 아래 함수가 실행된다. /* 완료한 리스트 처리 */ finishList = () => { let todo = event.target.parentElement.parentElement; let cover; for (let i = 0; i < todo.childNodes.length; i++) { if (todo.childNodes[i].nodeName === "#text") continue; if (todo.child..

TODOLIST - 03 DELETE LIST ADD A LIST SET PRIORITY DELETE & CLEAR LIST CHECK FINISHED LIST html 버튼 추가 체크, 삭제 버튼 추가 버튼 추가 삭제 및 체크 버튼 추가하기 ★★★ ✔ ✖ list를 추가할 때 button들도 추가해준다. doneBtn은 list를 완료해서 체크할 때 쓰는 버튼이고, deleteBtn은 list를 todolist 에서 삭제할 때 쓰는 버튼이다. list 체크는 다음 포스팅에서 다루겠다. list clear 버튼 추가 CLEAR todolist의 모든 list를 삭제할 때 쓰는 버튼을 footer에 추가한다. deleteList() & clearList() /* todo 삭제 */ deleteList = ..

TODOLIST - 02 SET PRIORITY ADD A LIST SET PRIORITY DELETE & CLEAR LIST CHECK FINISHED LIST html, css ★ ★ ★ radio 타입 input을 세 개 만들고, 각 input에 label을 달아준다. &#9733은 별 특수문자이다. 별 특수문자의 위쪽 여백이 커서, 세로로 가운데 정렬을 해도 가운데 정렬을 한 것 같지가 않아서 마음에 안 들었다. 다른 방법을 써서 위치를 조절했는데, 특수문자 대신 이미지를 사용할까 하다가 귀찮아서 그냥 별 특수문자를 사용했다. 각 input에 value를 내림차순으로 적용한다. 왜 오름차순이 아닌지는 바로 아래에 나타난다. #starRating { display: flex; flex-directi..