본문 바로가기

PROGRAM/Script Language26

[javascript] 호이스팅 (hoisting) 이란? 호스팅(hosting)은 많이 들어봤는데 호이스팅(hoisting) 은 생소한 단어였다. 호이스팅의 개념은 javascript 변수 범위를 설명하면서 자주 언급되었는데 오늘 해당 용어의 의미와 어떤 개념인지 확인해보도록 하자. [javascript] 호이스팅 (hoisting) 이란? 호이스트(hoist)는 건축/건설이나 화물 운반에 사용되는 장비로 화물 등을 들어올리는 업무를 수행한다. 즉, 아래에 위치한 것을 위로 끌어올리는 역할을 하는 장비인데 이 단어 자체로도 '들어올리다' 라는 의미를 가지고 있다. javascript에서의 호이스팅(hoisting)은 코드에 선언된 변수 및 함수를 코드 상단으로 끌어올리는 것을 말하며 이는 변수 범위가 전역 범위인지 함수 범위인지에 따라 다르게 수행될 수 있다... 2019. 5. 14.

[javascript] 변수 선언 방식의 차이 : var name / $name javascript에서 변수를 선언하고자 할 때 기본적으로 'var 변수명' 의 형태를 많이 사용한다. 뭐 그마저도 귀찮다면 var 도 생략하고 변수명에 값을 할당하는 방식을 쓰기도 하는데, 종종 보이는 '$변수명' 의 형태로 정의한 내용에 대해 차이점을 알아보고자 한다. [javascript] 변수 선언 방식의 차이 : var name / $name 다들 아시다시피 변수 선언 시 사용되는 예약어인 var는 variable의 약자로 선언하는 위치에 따라 global scope, function scope로 사용된다. 간단하게 변수 범위에 대해서 짚고 넘어가자. function 내부에서 선언한 변수는 지역 변수(function scope)로 해당 함수 내에서만 접근 및 호출가능하다. 정의한 함수 밖에서 호.. 2019. 5. 13.

.prop(), .attr()의 차이 jQuery를 통해서 동적으로 화면 구성을 만들일이 많다. 그런 경우, selector를 통해 선택한 element나 append 하면서 새롭게 생성하는 element에 특정한 속성을 지정하게 되는 경우가 많은데 이 때 사용되어지는 함수가 attr() 또는 prop() 이다. attr도 prop도 모두 속성값을 의미하는 attibute와 property를 의미하는 데 함수가 나눠져 있다는 것은 어쨌든 차이점이 있다는 말이므로, 비슷한 일을 하는 것 같으면서도 다른 듯한 이 두 함수의 차이점을 정리해보자. .prop(), .attr()의 차이 가장 정확한 확인방법은 다른 무엇도 아닌 jquery 공식 사이트에서 제공하는 API를 참고하는 것 만한게 없는 듯 하다. 그래서 찾아봤더니, jquery에서도 두 .. 2019. 1. 25.

JSON list 검색 : 특정 필드의 값이 일치하는 JSON Object 추출하기 오늘도 일하다가 유용한 함수를 정의해두고 미래의 나를 위해서 블로그에 옮겨봅니다. 검색결과를 javascript에서 처리하기 편리한 json 방식으로 전달받아두고 이 json list 목록에서 특정 내용을 검색하기 위한 function을 정의하였습니다. JSON list 검색 : 특정 필드의 값이 일치하는 JSON Object 추출하기 개발하는 사람마다 정의하는 내용이 일부 다르겠지만 제가 정의한 방식은 아래와 같았습니다. 조회 성공여부, 실패 시 실패사유, 검색결과 Object를 하나의 JSON Object로 선언하고 내부적으로 검색결과 Object는 List 형태로 구성되어 있습니다. KK { TYPE : "SUCCESS" MESSAGE : "성공" KK_LIST : [{SEQ : 1, NAME : .. 2018. 8. 24.

MVW (Model-View-Whatever) MVC는 Model-View-Controller 방식을 의미하는 것으로 가장 기본적인 디자인패턴이다. 이와 비슷한 느낌의 단어인 MVW도 디자인패턴을 말하는 걸까? MVW (Model-View-Whatever) MVW은 Model-View-Whatever를 의미하는 것으로 Whatever가 * (asterisk) 의 뜻을 가진다. Contoller, ViewModel, Apadter 등 다양한 방식의 디자인패턴을 지칭하는 의미로 사용된다. MVW가 등장하게 된 배경은 AngularJS가 이 개념을 선언하면서부터이다. 개발자들이 어떠한 디자인패턴을 선택해야 하는지를 두고 논쟁을 벌이며 시간을 버리는 것을 보고 AngularJS의 프레임워크를 MVW로 선언했다고 한다. 여기서 사용된 Whatever는 '무엇.. 2018. 8. 22.

HTML으로 메일 발송 시 CSS 깨짐현상 프로그램을 개발하다보면 담당자에게 알림 차원에서 메일을 발송하거나 주기적인 배치프로그램 결과 전송 또는 글 등록 내역에 대한 회신을 요청하는 등 다양한 내용을 담아서 메일 발송 기능을 만들 일이 생긴다. HTML으로 원하는 내용을 담을 형태를 만드는 거야 큰 문제가 아니다. 심지어 별도의 Mailing Form 파일을 만들어서 해당 페이지를 미리 보기해서 봤을 때는 완벽하게 딱 떨어지는 형태와 디자인이 나와서 업무 끝났다! 하고 기분 좋았는데 실제로 메일을 발송해서 수신결과를 봤을 때 좌절하는 경우가 생긴다. 바로 CSS가 깨지는 현상 때문이다. 알다시피 HTML로는 실제적인 데이터 형태만 구성해놓고 클라이언트에게 예쁘게 보여지도록 CSS를 적용하는데 CSS가 없으면 이건 뭐 왠 개발자가 내용만 덩그러니.. 2017. 9. 1.

jQuery seletor event 해제하기 / event override jQuery seletor event 해제하기 / 삭제하기 / event override 이벤트가 공통 script 파일에 지정되어 있어서 변경이 어려운 경우. 특정 페이지에서만 seletor에 대한 event를 변경하고 싶은 경우. event override의 개념 적용이 필요한 경우. 위에 나열한 경우에 대해 한 번은 고민한적이 있을텐데 너무나도 간단하게 적용하는 방법이 있어서 소개하고자 한다. 특정한 selector에 event별 handler를 적용하고자 하는 경우, on method를 많이 사용한다. bind, delegate, live 등 과거에 사용하던 모든 것을 on으로 대체가 가능한데 event 명시는 다음과 같은 방식으로 많이들 선언한다. $("#ojava").on("click", fu.. 2016. 12. 13.

javascript로 숫자 형변환하기 javascript를 통해 문자열 형태의 변수를 숫자로 변환해야 하는 경우가 많다. Data로 조회 조건으로 보내거나, 입력/수정 전 script를 통해서 validation 하는 경우,값에 대해 조건을 걸어서 비교가 필요한 경우,문자보다 숫자로 변환하였을 경우에 좀 더 편리하게 코딩이 가능한 경우 등 다양한 이유에서 형변환을 하게 되겠지만1월부터 12월까지의 월 선택값을 숫자로 형변환하면서 겪었던 내용을 바탕으로오늘 포스팅 할 숫자 형변환하기에 대해서 이야기하고자 한다. javascript는 별도로 타입을 명시하지 않고 변수를 선언하기 때문에 var testVal1 = "테스트 값입니다.";alert(typeof(testVal1)); -> 결과값 string // string 형태의 변수로 인식됨 va.. 2016. 1. 26.

폼 추가 및 삭제에 대한 Upgrade code 이전에 올렸던 버튼 클릭으로 폼 생성 및 삭제에 대한 코드의 문제점을 발견하였습니다. http://ojava.tistory.com/trackback/35 이전에 사용하던 코드로는 변수로 선언된 count가 폼 추가 시마다 1씩 증가합니다. 폼 삭제시에는 1씩 감소하겠지요. 만약 5개의 폼이 생성되어 있는 상태라고 가정해봅시다. count는 증가해서 6이 되어있겠죠. 4번째의 폼을 지우게 되면 count는 1이 감소하여 5가 됩니다. 따라서 다시 5번째로 폼을 추가하게 되면 count를 따라 5의 이름을 가진 폼이 또 다시 생성됩니다. 페이지를 이용하는 유저가 순차적으로 삭제하고 추가한다면 얼마나 좋겠습니까 ㅠ_ㅠ 하지만 그렇지 않다는 것. 그리고 그런 점을 고려해서 코드를 구성해야 한다는 것을 다시 상기.. 2011. 8. 9.

버튼 클릭으로 원하는 내용을 복사해보자. 버튼 클릭으로 ~~~ 해보자 시리즈가 되었네요! 딱히 의도하지는 않았는데.... 무튼 찾으면 여기저기 나오는 코드들인데 이를 조합해서 만들어봤습니다. Textarea에 적용되는 코드들이 많았는데 이 코드는 input box에 적용했으니 역시 되지 않을까요? /** * URL 복사를 위한 javascript * @author HyeYoungOh */ function URLcopy(which){ if (window.clipboardData) { var target_data=eval("document."+which); target_data.select(); zone=target_data.createTextRange(); zone.execCommand("copy"); alert("주소가 복사되었습니다. 붙여넣기.. 2011. 7. 6.

이전 1 2 3 다음

티스토리툴바