킹바구니

배열에서 중복값을 걸러내야할때가 있음. 근데 이게 중복값이 몇개가 있냐, 배열이 deep한 친구냐(막 배열안에 객체있고 그런), 최신문법을 써도 되냐 등에 따라 써야할 방법이 다름. 그래서 정리함. --- 1. indexOf와 filter를 사용하기 const arr = [1, 2, 1, 3, 4, 3, 5, 1, 1, 3, 3, 1, 5]; // [1, 2, 3, 4, 5] arr.filter(function(item, index) { return arr.indexOf(item) == index; }); 중복값이 있음 = indexOf로 찾았을때 index랑, filter함수 내에 index랑 값이 다름 을 이용한 형식임. 저 두값이 같다는 의미는 중복이 없다는 것이기떄문에 저렇게 써주면 중복없는 친구..

라든가 같은 안에 텍스트가 없는 부분은 건너뛰려고했는데, length든 뭐든 아무리 정규식으로 공백을 지워봐도 length가 1로 나와버림. 그렇게되면 ㅋ이것도 length가 1이니까 구분이 안되는데.. 하면서 삽질하다가 우연히 알아냄 1. charCodeAt var text = element.charCodeAt(); if (text == 8203 || text == 160 || text == 32) { return; } 8203은 $zero width space 160은 32는 스페이스바 누르면 생기는 공백을 나타냄

js문법 속도 측정 사이트를 알게된 이상 한번 정리하는 겸 테스트해봄. 각 테스트마다 문법이 여러개가 있는것도 있지만 상위 4,5위까지만 가져와봄. 덕분에 잊고있었던 문법공부도 다시 하게댐 후후 테스트 브라우저: 크롬 https://jsben.ch/browse JSBEN.CH Performance Benchmarking Playground for JavaScript jsben.ch ---------------------------------------------- 1. array 복사해서 만들기 json stringify는 자주썼는데 이거 좋은 방법이 아니네 어쩐지 어디서 느리다는걸 본적이 있는데.. 앞으로는 slice나 concat을 써야할듯(참고로 concat은 원본 array와 참조된 링크가 끊겨서..

1. nodeName vs matches event.target을 했을때 해당 요소가 어떤 태그인지 알려면 nodeName을 확인하면 됨. 그러나 기본적으로 nodeName은 이렇게 대문자로 나오기때문에 event.target.nodeName.toLowerCase() == 'summary' 이렇게 비교를 해줘야함(아님 걍 대문자로 비교해도 됨). 근데 어느순간 저렇게 하는게 혹시 구린방법(?)이 아닐까라는 생각에 찾아봄. https://stackoverflow.com/questions/44595875/event-target-tostring-or-event-target-nodename-to-check-type-of-element event.target.toString() or event.target.nod..

기본 html로만 작업하다보면 header, footer등과 같이 모든 html에 똑같이 나오는걸 일일히 넣어줘야하나?라는 생각이 들기 시작할것임. 넣는거야 별거아닌데 나중에 한 html파일 20개정도 되는데 header에 뭔가 추가해야한다면 끔_찍... 이에 대한 방법(링크)은 여러가지가 있지만 그나마 뭔가를 안깔고 기본 내에서 할 수 있는거는 이게 제일 유용해서 작성함. 예전에는 php로 했었는뎅 암튼 파일 구조는 다음과 같음. 파일 구조는 뭐든 상관없음. 1. 공통적으로 만들 파일 따로 만들기 나같은 경우 header.html을 생성하여 이하 태그를 넣어뒀고, index.html에는 까지만 써둠. 이제 자바스크립트로 밑에 친구들을 넣을 것임. 2. script에서 불러와줌 const header =..

if { // 조건1 } else if() { // 조건2 } else if() { // 조건3 } 얘는 조건1만 만족하면 그거 실행하고 끝남. 조건3이 만족해도 조건1만 하고 끝남. if { // 조건1 } if { // 조건2 } if { // 조건3 } 얘는 만족하는 조건 있으면 다 들어감.

1. HTMLElement.style document.querySelector('div').style.left = '100px'; document.querySelector('div').style.width = '200px'; 어떤 element을 css말고 javascript로 변경하고 싶다면 이렇게 쓰면 됨. 그런데, width값을 알고싶어서 저걸 쓰면 값이 제대로 나오지 않음 그 이유는 css나 인라인코드로 width값 등이 설정되어있더라도, 자바스크립트로 별도로 지정되지 않았다면 style.width형태로는 요소의 값을 뽑아낼 수 없음. 즉 css로 display: none을 해서 화면상에는 없어도 자바스크립트로 별도로 값을 지정해줬다면 그 값을 출력함. 자바스크립트로 width를 10000px로 ..

가끔 로그찍을때 요로코롬 나올때 있음. 객체형태라서 그런데 방법은 2가지 1. JSON.stringify console.log(JSON.stringify(data)) 2. console.dir console.dir(data)

promise, asnyc, await 이런 최신 문법들이 나왔지만 현실적으로 ie를 맞춰야한다거나 하는 상황이 벌어지면 쓸수가 없음. 그럼 콜백함수를 쓸수밖에 없는데 어쩌다보면 막 너무 지저분해지고 길어지고 하는 상황들이 벌어짐. 그래서 polyfill을 찾아보다가 유튜브에서 한번 보고 따라해봄. https://codepen.io/pmx/pen/XWZJzGM promise polyfill (IE9 맞춤) ... codepen.io ---------------------------- 아니면 이를 지원하는 라이브러리같은게 있는데 하나 아는거는 rsvp.js라서 이걸로도 한번 해봄. https://codepen.io/pmx/pen/abErVqx RSVP.js (IE9 맞춤) ... codepen.io

1. jquery 확인 - 제이쿼리가 먼저 로드가 되었나 - 경로가 제대로 설정되어서 정상적으로 불러와졌나 2. 이렇게 써보기 // 기존 $(document).ready(function() { // code }); // 이렇게 변경 $(document).ready(function($) { // code }(jQuery)); --------------- https://stackoverflow.com/questions/1857072/why-is-document-ready-not-firing-for-me/2409157