addEventListener함수는 event정보를 보내준다.
a
function onLoginSubmit(info){
info.preventDefault();
console.log(info);
}
LoginForm.addEventListener('submit', onLoginSubmit );
function deleteToDo(event){
const li =event.target.parentElement; ///target은 클릭된 element -->button
li.remove();
}
배열은 각각의 아이템에 함수를 실행시켜준다.
이벤트리스너함수가 event에대한 정보를 주는 것처럼
일반함수도item에대한 정보를 기본으로 제공한다.
const toDo=["a","b","c","d"];
function sayHello(item){
console.log("this is the turn of", item);
}
toDo.forEach(sayHello);
함수를 따로 만들지 않고 화살표함수로으로 다음과 같이 작성해도된
toDo.forEach((item)=> console.log("this is the turn of ", item));
하
const li = document.createElement("li"); //Element(HTML상)에 존재하지 않음
document.body.ul.appendChild(li); //prepend 맨앞에 append맨 뒤에
const bgImage = document.createElement("img");
bgImage.src =`IMG/${chosenImg}` //속성설정
-시계 프로젝트에서
"1".padStart(2,"0") //"1"이라는 문자열을 2글자로 만드는데 두글자가 되지 않으면 앞쪽에 0을 붙히는 함수
"hello".padStart(20,"x")
.padEnd는문자열을 뒤에추가
setInterval(실행하고자하는 함수, 몇초간격 ms)
setTimeout( , ) 얼마 후에 작동 할 건지
5000ms = 5초
forEach와 닮은filter = 선택옵션
빼는 게아니라 지우고싶은 item을 제외하고 array를 만드는 것 기존에 array 에 영향을 주지 않음
새 array에서 포함하고 싶다면 true를 반환해야됨
const arr = [1,2,3,4];
function sexyFilter(item){
return item !=3
}
newarr = arr.filter(sexyFilter); // [1,2,4]
arr; //[1,2,3,4] 기존의 배열은 변경되지 않는다.
local Storage
localStorage.setItem(키, 값);
localStorage.getItem(키);
localStorage.removeItem(키);
local Storage에 배열을 저장 할 수없다.
문자열만 저장가능
따라서 [a,b,c,]인배열을 저장해도 localstorage에 a,b,c,만저장됨
따라서 JSON.stringify 사용
const player = {name:"nico"}
JSON.stringify(player);
javascirpt object, array 어떤 코드건간 string으로 만들어줌
"{/ name/"/"nico/"}"
["a","b","c"]
반대로 문자열을 array 로 바꿀 수있다.
JSON.parse("[1,2,3,4]")
--> [1,2,3,4]
const superEventHandler = {
hanldeEnter: function(){
h2.innerText ="The mouse i s here";
},
hanldeLeave: function(){
}
}
객체 내부에 선언한 함수를 메서드라고함
