클래스의 용도 - - 1) 데이터 타입 2) 메서드 분류
우리가 데이터 타입을 정의할 때 사용함 우리가 어떤 데이터를 다뤄야할지 항상 생각해야함(어플리케이션이 다루는 데이터)
코드를 기능단위로 묶은 게 function 이 function 을 묶은 것을 class class를 묶은 것을 package
UML - 우리 머릿속에 있는 거를 추상화(?) 시키는 것
생각 속에 있는 것을 글과 그림으로(추상화)하는 것을 Modeling 이라고 함 이 과정의 규칙을 UML이라고 함 (UML은 분석가, 설계자가 사용하는 문법)
우측 화면에 outline 누르면 메서드 목록나옴
경험적 기술 모음 "Design Patterns" 이제부터 패턴이라는 말이 나오면 경험으로 얻은 기술이다. 라는 말이 포함 돼있음. 향후 확장성이 좋다.
지구의 프랙탈 패턴?
우리가 오늘 할 거는 GRASP 디자인 패턴의 High Cohesion(높은 응집력(전문화)) 설계기법 쓸 거다
강사님은 필터다~
이름을 일부러 내장 함수랑 비슷하게 이름을 ArrayList로 짓는데 그 이유는 일부러 이런 일을 하는 클래스다 라고 알려주는 거임. 타입을 알려줘야해서 contacts : Contacts[ ] 라고 써줌
GRASP(General Responsbility Assignment Pattern)
-High Chhesion
-Low Coupling
-Information Expert
다형적 변수 활용
- 다양한 타입의 객체 주소를 받을 수 있는 레퍼런스 변수를 활용하기
ArrayList2.set(index, todo); == null ? 0 : 1;
이 라인은 프론트엔드를 위한 거임
onst tbodyEle = document.querySelector('#x-table tbody')
//삭제 버튼을 클릭했을 때 호출될 리스너 등록하기
// 삭제버튼은 동적으로 생성된다 그래서 부모태그에 리스너를 등록하는 방법이 있음
tbodyEle.onclick = (e) => {
//if (e.target.localName === 'button') {
if (e.target instanceof HTMLButtonElement) { // 이거 조타ㅇㅇ
console.log("okok!")
}
}부모태그에서 부터 자식태그로 내려오면서 찾는 방법
동적으로 생성되는 코드에 대해서 onclick 에 대해서 실행될 함수를 넣어듐
// 삭제 버튼을 클릭 했을 때 호출될 리스너 등록하기
// => 삭제 버튼은 동적으로 생성된다.
// => 따라서 부모 태그에 리스너를 등록해야 한다.
스타일 태그가 동적으로 바뀜
class 목록을 가지고 있는 게 classList 임
자스로 직접 css 를 하는 건 좀 낮은 수준임
if (checked) {
titleTd.classList.add("todo-checked") // 모든 태그들은 classList 를 가지고 잇음
} else {
titleTd.classList.remove("todo-checked")
}
이런 식으로 짜면 된다.
화면에 영향을 끼치지 않으면서 영향을 끼치는 방법 span 태그
span태그는 ui에 영향을 끼치지 않음
