window.scroll()(window.scrollTo()와 효과적으로 같다) 은 document의 절대적인 위치로 스크롤한다 document의 (0,0)에서부터 시작하여 parameter로 넘겨준 값만큼 이동한다. window를 절대적인 좌표로 이동한다. window.scrollBy()는 상대적인 스크롤링에 사용한다. 현재 위치를 기준으로 parameter로 넘겨준 값만큼 이동한다. parameter로 넘겨준 값만큼 이동하므로, scrollBy()를 여러번 클릭하면 그 값만큼 계속 이동한다. 상대적인 스크롤링에 사용하는 메소드 : window.scrollBy(), window.scrollByLines(), window.scrollByPages() https://developer.mozilla.org/..
특정위치에 DOM tree에 원하는 node를 추가한다. innerHTML보다 빠른 속도 element.insertAdjacentHTML(position, text); position 'beforebegin' : element 앞 'afterbegin' : element 내부 첫번째 child 'beforeend' : element 내부 마지막 child 'afterend' : element 뒤 https://developer.mozilla.org/ko/docs/Web/API/Element/insertAdjacentHTML
더보기 강의 수강 중 잘못된 부분이 있는 듯 해서 확인하다가 정리 해 본다😲 잘못되었던 예 const randomInt = (min, max)=> Math.trunc(Math.random() * (max - min) + 1 ) + min; 최소값이 포함되지 않은 정수가 출력된다. 더보기 randomInt(1, 6); Math.random()은 0에서 1미만(1 포함 안됨)의 부동소숫점을 반환한다. 따라서, (0....1) * (6-1) + 1 0.1 * 5 = 0.5, + 1 = 1.5, + 1 = 2.5 0.2 * 5 = 1.0, + 1 = 2.0, + 1 = 3.0 0.3 * 5 = 1.5, + 1 = 2.5, + 1 = 3.5 0.4 * 5 = 2.0, + 1 = 3.0, + 1 = 4.0 0.5 ..
sort는 배열의 요소를 정렬하여 반환한다. 즉, 원본 배열 자체가 바뀌므로 주의하여 사용한다. (복사본이 만들어지는 것이 아님) const owners = ['Jonas', 'Zach', 'Adam', 'Martha']; console.log(owners.sort()); // ["Adam", "Jonas", "Martha", "Zach"] console.log(owners); // ["Adam", "Jonas", "Martha", "Zach"] 기본 정렬 순서는 문자열의 유니코드 포인트를 따른다. 요소를 문자열로 변환하고 정렬하기 때문에 숫자라고 하더라도 문자로 생각하여 인식한다(함수가 없는경우) const movements = [200, 450, -400, 3000, -650, -130, 70, 13..
안에 태그가 있는 경우에는 클릭시 기본적으로 페이지가 reload된다. 이를 막기 위해서는 아래와 같이 자바스크립트로 preventDefault 로 기본동작을 막을 수 있다. 버튼.addEventListener('click', function(e)) { e.preventDefault(); }); 혹은 button 태그에 type속성을 button으로 주면 페이지가 새로고침되지 않는다. https://stackoverflow.com/questions/1878264/how-do-i-make-an-html-button-not-reload-the-page
map : 새로운 배열을 반환한다. 새로운 배열은 원본 배열 객체에 연산을 거친 결과들을 객체로 가진다 각 객체를 순회하면서 해당연산 결과를 새로운 배열 객체로 반환한다 forEach와 다름 forEach는 배열을 순환하면서 어떤 행위를 side effect 로 수행하는 것 뿐, 하나씩하나씩.. 어떤 일을 하는데.. 배열을 반환하는 것은 아니다! map은 콜백함수를 통해서 새로운 값들을 배열의 객체로 반환한다, 끝나고 그 배열을 return 하는 것이다 한번에 filter: 새로운 배열을 반환한다 새로운 배열 객체는 filter에서 특정 테스트 조건을 통과한 것들만으로 구성된다. filter()메서드는 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환한다. 즉 return 부분에 조건..
https://programmers.co.kr/learn/courses/30/lessons/81301 코딩테스트 연습 - 숫자 문자열과 영단어 네오와 프로도가 숫자놀이를 하고 있습니다. 네오가 프로도에게 숫자를 건넬 때 일부 자릿수를 영단어로 바꾼 카드를 건네주면 프로도는 원래 숫자를 찾는 게임입니다. 다음은 숫자의 일부 자 programmers.co.kr 👇 문제확인 👇 더보기 네오와 프로도가 숫자놀이를 하고 있습니다. 네오가 프로도에게 숫자를 건넬 때 일부 자릿수를 영단어로 바꾼 카드를 건네주면 프로도는 원래 숫자를 찾는 게임입니다. 다음은 숫자의 일부 자릿수를 영단어로 바꾸는 예시입니다. 1478 → "one4seveneight" 234567 → "23four5six7" 10203 → "1zerot..
작성중📝정리하기!!📝 함수는 variable environment (VE)에 접근한다 excution context가 생성된 때에 심지어 그 EC가 사라진때에도 booker 함수가 생성된 때에 스코프에 정의되었다. (강의 136) VE는 계속 살아있다. 엔진어딘가에 closure는 스코프체인보다 먼저 자기들 함수 안에서 찾을 수 없는 변수를 closure에서 먼저 찾지 scope chain에서 찾지 않는다. 그 이후에 찾는다. closure: Variable Environment 가 함수에 붙어있다. 정확히 그 함수가 생성된 그 때에 그래서 그걸 기억하고 사용할 수 있다. 클로저는 함수가 접근할수 있도록 한다. 그 부모 함수가 가지고 있는 variable에 접근할 수 있도록 한다. 심지어 그 부모 함수가..
First-Class Functions 일급함수 자바스크립트는 함수를 First-class citizens으로 취급한다. 함수가 단순히 value 함수는 단수 object의 한 type이다. Higher-Order Functions 고차함수 인자로 또 다른 function을 받을 수 있는 함수 새로운 함수를 반환하는 함수 혹은 둘 다 👉 이는 first-class functions이기 때문에 가능하다. First-class functions ≠ Higher-order functions 작성중 Higher-order functions callback abstraction