본문 바로가기

JavaScript23

JavaScript: requestAnimationFrame (수정중) - setInterval의 단점을 극복한 것 - 캔버스에서 많이 사용한다. - function 안에서 계속 호출한다면 무한히 반복된다. -> cancel의 기능 2020. 6. 9.
JavaScript: 스크롤 관련 팁 pageYOffset -> 그냥 스크롤의 위치 (ex/ window.pageYOffset) offsetTop -> 대상위치의 고정좌표 (ex/ box.offsetTop) offsetHeight -> 대상의 높이 getBoundingClientRect() -> (메서드) 화면에 따른 대상의 위치 1. height를 vw로 지정해주면, 스크롤을 옆으로 늘리거나 줄일때 비율이 알맞게 조정된다. 2. window.offsetHeight - window.innerHeight : 내가 해야할 나머지 스크롤 부분의 길이가 된다. Jquery와 비교 https://jellybrown.tistory.com/54 Jquery: 스크롤 offset() -> 화면기준 offset().top -> 대상의 top 값 scroll.. 2020. 6. 7.
JavaScript: let, const, var 스크립트 작성시 웬만하면 let, const 사용할것. let - 변할수 있는 값, 블록스코프 const - 변하지 않는 값, 블록스코프 var - 함수스코프단위, 객체와 변수의 구분이 없어서, 곤란한 상황이 생길 수 있음. ★ const 기본적으로 변경이 불가능한 값이다. 객체 안에있는 프로퍼티들은 변경이 가능하다. 배열일경우 안에 넣고, 빼는것은 가능하다. 그냥 for문은 불가능하지만, for..in, for..of는 가능하다. 2020. 6. 4.
JavaScript: this this는 상황마다 다른 것을 가리킨다. 먼저 선언해준 것이 있을 때의 this는 선언해준 것을 가리키고, 선언해준 것이 없을 때의 this는 window를 가리키게 된다. function Example(value, number) { this.value = value; this.number = number; } 이때, 프로토타입을 이용한다면 Example.prototype = { construnctor: Example, init: function () { window.addEventListener("click", function () { this. }); }, }; 이렇게 이용할 수 있지만, click이벤트 안에서 this를 쓰게된다면, 이 상황에서는 window를 가리키게 된다. 생성자함수 안에서의 t.. 2020. 6. 1.

티스토리툴바