둥지

이번 파트는 자바스크립트의 참조와 복사에 대해서 공부하는 파트입니다. 1. const players = ['Wes', 'Sarah', 'Ryan', 'Poppy']; const team = players; console.log(players, team); team[3] = 'Lux'; console.log(players, team); 결과는 players와 team이 같이 바뀐다 이것은 얕은 복사라서 그렇습니다. 2. const team2 = players.slice(); const team3 = [].concat(players); // 아래 두 방법은 ES6부터 사용가능합니다. const team4 = [...players]; const team5 = Array.from(players); 배열은 위의 ..

이번 파트는 많이 쓰이는 스크롤을 내리면 이미지가 날아오는 것을 구현하는 파트입니다. 1. slide-in 클래스를 가진 element들을 변수로 저장. const sliderImages = document.querySelectorAll('.slide-in'); 2. 이미지 슬라이드 체크 함수 구현. function checkSlide() { sliderImages.forEach(sliderImage => { // 이미지의 절반 계산 const slideIntAt = (window.scrollY + window.innerHeight) - sliderImage.height / 2; // 이미지의 하단 계산 const imageBottom = sliderImage.offsetTop + sliderImage...

이번에는 비밀키를 설정해두고 비밀키를 입력할경우 유니콘이 뜨게하는 파트입니다. 그럼 시작해보겠습니다. 1. 먼저 비밀키를 설정합니다. const secretCode = 'wow'; 2. 키업 함수를 만듭니다. function handleKeyup(e) { pressed.push(e.key); pressed.splice(0, pressed.length - secretCode.length); // splice는 slice와 다르게 if (pressed.join('').includes(secretCode)) { cornify_add(); } } 3. 만든 함수를 이벤트로 등록합니다. window.addEventListener('keyup', handleKeyup); cornify_add 함수는 cornify...