이 기술 블로그를 만들기 위해 5년을 미뤘다.

javascript에서 window.open(url)을 사용하면 현재 부모창에서 새로운 페이지를 열 수 있다. window.open([URL 또는 html 파일명], [자식 창의 접근자 이름], [자식 창의 스타일]) 예를 들어, 다음과 같은 방식으로 사용하면 된다. window.open('https://www.naver.com/', 'naverView', 'width: 240px, height: 400px'); // 해당 url을 새로운 탭에서 엶 window.close(); // 해당 창을 닫음 SNS 로그인 등을 구현할 때 새 창을 띄워서 권한 승인을 받는 경우가 많은데, 이 때 해당 창이 닫힌 여부를 판단하여 이벤트를 발생시키고 싶다면? window.open() 함수가 window 객체를 반환하기..

forEach(element, index, array) 입력받은 배열의 요소와 인덱스를 차례대로 반환 리턴값 없음, for문처럼 사용 let arr = [1, 2, 3, 4, 5] arr.forEach(e => console.log(e)) // 차례대로 1, 2, 3, 4, 5 출력 for ... in / for ... of forEach에서 할 수 없는 break, continue 등 사용 가능 for ... of는 배열의 요소 값을 차례대로 반환 for ... in은 객체의 key값을 차례대로 반환 (배열에서의 for ... in은 인덱스를 순서대로 반환) let arr = [1, 3, 5, 7, 9] let kmj = { name: '미정', age: 25, job: '개발자' } for (let ..

211203에 호이스팅 관련 설명을 보충했습니다! 자바스크립트에서는 ES6 문법부터 var를 이용한 변수 선언을 권장하지 않고 있다. 메모리 누수 문제 때문이라고만 알고 정확한 이유는 모른 채 const와 let을 사용하고 있었는데, 오늘 정확한 이유와 차이점 등을 정리해 보려고 한다. var, let, const의 차이는 변수 재선언 가능 여부와 변수 재할당 가능 여부에 있다. 변수 재선언이란? 같은 변수명으로 다시 변수를 선언하는 것 변수 재할당이란? 선언된 변수에 값을 다시 할당하는 것 - var : 변수 재선언 가능 → 예기치 못한 값을 반환할 수 있음 var t = 3 console.log(t) // 3 출력 var t = 'hello' console.log(t) // hello 출력 t = 3..

프론트앤드 개발을 하다 보면 iframe이나 object 태그를 사용할 때가 있다. 근데 iframe이나 object 태그 내에서 사용되는 link나 div 같은 태그들은 일반적인 방법으로는 접근이 안된다. 위 스샷처럼 object 태그를 사용하여 svg 파일을 불러와 화면에 표출하는 방법을 사용하여 히트맵 지도를 만들었는데, object 객체 내의 dong1 ID값을 갖는 path 객체에 접근할 수 없는 문제가 발생했다. 해결 방법은 아래와 같다. Javascript 1. 접근하려는 iframe이나 object 객체 뒤에 .contentWindow.document를 붙여 접근 document.getElementById("map").contentWindow.document.getElementById("d..

배열을 0으로 초기화 let dataList = [1, 2, 3] dataList.fill(0) // 혹은 dataList.map(e => 0) 배열 일부만 0으로 초기화 let dataList = [1, 2, 3] dataList.fill(0, 시작 인덱스, 종료 인덱스) // 혹은 dataList.map((e, i) => 시작 인덱스

보통 .click()으로 많이 코드를 짜는데, 자바스크립트로 동적 생성된 객체에는 저게 안먹힌다. 아래 코드처럼 수정해야 코드가 먹힌다. $(".dj-tok .mem-list > li").click(function() { $(".mem-list > li").removeClass("active"); $(this).addClass("active"); }) ↓ 수정 $(document).on("click", ".dj-tok .mem-list > li", function() { $(".mem-list > li").removeClass("active"); $(this).addClass("active"); })