JavaScript23 JavaScript: addEventListener와 setTimeout, clearTimeout setTimeout은 몇 초 뒤에 실행할건지 지정할 수 있는 메서드이다. setTimeout이 어떻게 쓰이는지에 대해서 좀 더 면밀히 볼 필요가 있었다. 초보자가 공부하는 입장에서 매우 헷갈리기 때문이다(..) 공부하면서 좀 더 잘 알게되면 게시글을 수정할 예정이다. 나는 박스를 클릭하면 2초뒤에 박스가 사라지게 하고싶었다. 사실 아래처럼 setTimeout을 쓸 수 있는줄 알았는데, 실행해보니 되지않았다. box.addEventListener("click", setTimeout()); addEventListener의 두번째 인자에는 함수를 넣어줘야해서, function() {~ 혹은 따로 함수를 지정해서 적용해야 한다. box.addEventListener("click", noneEvent); func.. 2020. 5. 17. JavaScript: concat, join concat은 새로운 배열을 만드는 메서드이다. concat은 문자열을 합칠 수도 있지만, concat을 쓰지않고 보통 연산자로 쓴다. const warmColor = ["orange", "rosepink", "gold"]; const coolColor = ["hotpink", "red", "purple"]; const color = warmColor.concat(coolColor); color는 새로 생성되는 배열이며, 기존의 다른 것들은 영향을 받지 않는다. console.log(color); console.log(warmColor); console.log(coolColor); 브라우저에서 확인해보면 이렇게 나온다. join은 문자를 원하는 기호와 함께 합칠 수 있다. const ae = ["a", .. 2020. 5. 16. JavaScript: 객체, 생성자, prototype 객체는 아래와 같이 만들 수 있다. const person = { fullname: jellybrown, age: 26, }; 하지만 1명이 아닌 여러명인 경우에, 생성자(constructor)를 이용하면 편하다. function Person(fullname, age) { this.fullname = fullname; this.age = age; } 생성자의 앞글자는 대문자로 한다. 매개변수에는 바뀌는 값을 써준다. this는 새로 생성되는 아이를 가리킨다. const person1 = new Person("jellybrown", 26); const person2 = new Person("gom", 10); const person3 = new Person("mong", 11); 생성할때는 new를 붙여 .. 2020. 5. 15. JavaScript: classList (add, remove, contains) 클래스를 추가하거나 삭제하거나, 클래스의 유무를 확인하고 싶을 때 classList를 쓸 수 있다. classList.contains: 클래스를 가지고있는지 확인할때 classList.add: 클래스 추가 classList.remove: 클래스 삭제 html의 소스가 다음과 같을때, classList 이렇게 한다면 const title = document.querySelector(".title"); if (title.classList.contains("title")) { title.classList.add("red"); } 안에 red가 추가되는 것을 볼 수 있다. remove도 add처럼 사용이 가능하다. 2020. 5. 13. 이전 1 2 3 4 5 6 다음
