정도영 Tech-Blog 정도영 Tech-Blog

const cards = document.querySelectorAll('.card'); const cards = document.getElementsByClassName('card'); 단순히 이벤트리스너를 달기위해 선택자로 저 함수를 사용할때는 몰랐는데, 저 함수들은 각각 다른 형태의 객체를 반환한다. querySelectorAll는 NodeList를 반환하고, getElementsByClassName는 HTMLCollection을 반환한다. 둘의 공통점은 유사배열이라는것! 어쨋든 두 자료형은 iterable로써 열거 가능한 속성을 갖는데 따라서 for 문 등으로 인덱스별 순환이 가능하다. 하지만 두 자료형을 직접적으로 조작해 dom을 바꿔주려하면 개발자의 의도대로 잘 동작하지않을 수 있다. 이는 역..

sort는 배열의 순서를 요청에따라 변화시킨다. 옛날에 만들어진 함수라 배열 자체의 데이터를 변화시킨다. sampleArray.sort(); 는 기본적인 형태로서 a, b, c 와 가, 나, 다 이런 순서로 정렬한다. 즉, 디폴트 기능이 text의 순서를 비교한다는것이다. 그래서 숫자를 넣으면 1, 1000, 2, 500 이런식으로 숫자의 값이 아닌 1~9 까지의 순서만으로 분류한다. 그래서 number형의 크거나 작은 순서로 정렬하려면.. sampleArray.sort(function(a, b) { return a - b; }); 요런식으로 해야한다. 저래서 return값이 음수라면 a가 b보다 작다는 뜻이므로, a와 b의 위치는 변하지않는다. 하지만 a - b가 양수가 나와서 a가 더 큰 값이라는게 ..