본문 바로가기

728x90

JavaScript

[JavaScript] 호이스팅(Hoisting) 호이스팅(Hoisting) 호이스팅(Hoisting)이란, 자바스크립트의 변수나 함수의 선언부분을 변수의 맨 위 범위로 강제로 끌고가 가장 먼저 선언합니다. 이 현상을 호이스팅(Hoisting)이라고 합니다. // 우리가 작성한 코드 function fc(){ var name = 'kim'; } if(true){ let name = 'park'; } var age = 30; // 이 부분에서 호이스팅이 일어남 ------------------------------ // 호이스팅이 되었을 때의 상황 var age; // -> 우리가 작성한 코드에는 아래 선언했지만 Hoisting 현상으로 맨 위로 끌어올려 선언시키게 됨 function fc(){ var name = 'kim'; } if(true){ let.. 더보기
[JavaScript] 기존 function과 Arrow function 의 차이 기존의 함수 표현식 function(){} 보다 단순하고 간결한 문법으로 함수를 만들 수 있는 방법이 있습니다. 바로 화살표 함수(arrow function) ()=>{} 를 사용하는 것입니다. 기존 함수 사용방법 function fc1(){ // 함수 사용 방법1 } var fc2 = function(){ // 함수 사용 방법2 } fc1(); // 함수 실행 fc2(); // 함수 실행 화살표 함수(Arrow Function) var fc = () => { // arrow function } fc(); // 함수 실행 기존 함수만 사용하던 개발자들에게는 화살표 함수가 익숙치않아 새로운 프로젝트를 진행하더라도 기존의 함수 사용방식으로 개발을 지속하는 경우가 많습니다. 하지만 화살표 함수가 가진 장점들이.. 더보기
[JavaScript] this의 상황별 뜻 개발을 하다보면 자주 보이고 자주 심란하게 만드는 this키워드 상황별로 각각 가리키는 대상이 다릅니다. 1. 그냥 쓰거나 함수 안에서 쓰는 this는 window를 가리킨다. // 빈 화면에서 console.log(this); // window --------------------- // 일반 함수 안에서 function fc(){ console.log(this); // window } fc() 2. 오브젝트 내 함수에서 쓰는 this는 현재 위치한 함수의 오브젝트명을 가리킨다. var Obj = { data : 'kim', fc : function(){ console.log(this); // Obj } } } Obj.fc(); // Obj ----------------------- var Obj = .. 더보기
[html/javascript]웹에서 모달팝업 시 부모창 스크롤 막기 웹에서 모달팝업을 사용할 때 부모창의 스크롤이 되어 애먹은 경우가 자주 있습니다. 그래서 구글링을 통해 방법을 알아보았고, 아래 코드가 현재 찾아서 사용하고 있는 방법이에요. 모달팝업을 열 때 : $('html, body').css({'overflow': 'hidden', 'height': '100%'}); // 모달팝업 중 html,body의 scroll을 hidden시킴 $('#element').on('scroll touchmove mousewheel', function(event) { // 터치무브와 마우스휠 스크롤 방지 event.preventDefault(); event.stopPropagation(); return false; }); 모달팝업을 닫을 때 : $('html, body').css(.. 더보기
Syntaxhighlighter를 사용하여 코드 입력할 때 HTML체크박스를 둔 후 아래 소스를 작성하고 다시 체크박스를 해제합니다. 그리고 생성된 회색박스 안에 코드를 입력하면 됩니다. 더보기

728x90