기존의 C계열(C, Java)의 프로그램에서 변수의 유효범위는 {}로 정해진다.
자바스크립트도 문법은 C계통과 비슷 ( java) 하기에 당연스럽게 {}가 변수 유효범위인줄 알았다.
아래와 같이 테스트 해보니 예외가 발생하지 않는다.
결국 자바스크립트에서 변수의 유효범위는 함수기반이다.

* 확실히 하기 위해서 익명함수를 만들고 바로 try catch 구분을 걸었으며 if문 안의 {}안에 변수를
  선언했지만 결과적으로 유효하게 alert창이 출력된다.

//예외가 발생하지 않는다.
try {
    alert((function() { 
        try {
            if ( true ) {
                var myVal = "함수 안의 if 구분 안입니다.";
            }
        }
        catch(e) {alert(e.message);}
        finally  {}
        
        return myVal;
    })());
}
catch(e) {alert(e.message);}
finally  {}

posted by 뚱2

/**

* POST 방식으로 전송하는 팝업창

* url        : 팝업창 경로

* data       : object, array

* popName    : 팝업창 이름 

* popWidth   : 팝업창 가로 길이 (생략하면 화면 넓이에 맞춰진다.)

* popHeight  : 팝업창 세로 길이 (생략하면 화면 높에에 맞춰진다.)

* popOptions : 팝업창 옵션 (생략하면 기본으로 scrollbars=yes 이다.)

* comment :

*     데이터를 json 형식으로 넘겨도 된다.

*     예) gls.openPostPopup({

*             url     : 경로

*            ,data    : json data

*            ,target  : 이름

*            ,width   : 넓이

*            ,height  : 높이

*            ,options : 옵션

*         });

*     데이터가 필요없는 부분은 json property로 넣지 않아도 된다.    

*/

SEED.openPostPopup = function(obj, data, popName, popWidth, popHeight, popOptions) {

var myPop = null;

try {

var param = null;

// json object이라면

if ( obj && typeof obj == 'object' ) {

param = {

'url'     : SEED.url(obj.url)   || ''

,'data'    : obj.data                 || []

,'target'  : obj.target               || ''

,'width'   : obj.width               || screen.availWith

,'height'  : obj.height               || screen.availHeight

,'options' : obj.options             || 'scrollbars=yes'

};

}

else {

param = {

'url'     : SEED.url(obj)       || ''

,'data'    : data                     || []

,'target'  : popName                 || ''

,'width'   : popWidth                 || screen.availWith

,'height'  : popHeight               || screen.availHeight

,'options' : popOptions               || 'scrollbars=yes'

}; 

}

if ( $.type(param.data) == "object" ) {

param.data = [param.data];

}

//랜덤한 수를 출력

var curDate   = new Date();

var ranNumber = Math.floor(Math.random() * 10000) + 1;

var strId = "";

   strId += param.target;

   strId += "_";    

   strId += (new Date()).getTime();

   strId += "_" + ranNumber;

   

var $popForm = $("<form onSummit='return false;'></form>")

.attr("name"  , strId)

.attr("id"    , strId)

.attr("method", "POST");

if ( $popForm ) {

// 배열 순회

$.each(param.data, function(i, elem) {

// 객체 순회

$.each(elem, function(key, val) { 

       $("<input type='hidden'/>")

       .attr("name" , key)

       .attr("value", val)

       .appendTo($popForm);

});

});//$.each(para.data, function(i, elem) {

$popForm.appendTo(document.body);

   myPop = SEED.openWin("", param.target, null, param.width, param.height, param.options);

   var myForm = $popForm[0];

   myForm.action = param.url;

   myForm.method = "POST";

   myForm.target = param.target;

   

   // 현재 생성한 form을 삭제한다.

   myForm.submit();

   if ( $popForm.size() > 0 ) {

    $popForm.remove();

   }

}//if ( $popForm ) {

}

catch (e) {alert(e.message);}

finally   {}


return myPop;

};


posted by 뚱2
아이디어는 간단하다  Dom Object를 동적으로 생성할때나
동적으로 함수를 호출할때 리터럴 객체를 인자로 전달하는게 일반 인자를 쭉 나열하는것보다 편하다
이유는
1. 객체 쪽에 속성을 추가하면 함수 인자를 추가하는 효과가 있다.
2. 인자 리스트가 지저분하게 길어지지 않는다.
3. 인자의 순서를 신경쓸 필요가 없다.
그리고 가장 중요한 편한점중 하나는 유지보수 및 관리가 편하다는 것이다.

// 포매터
function myFormatter(cellvalue, options, rowObject) {
	var retString = "";
	var strJsonText = JSON.stringify(rowObject);
    strJsonText = strJsonText.replace(/\"/gi, "'");
    	
    // 문항관리
	if ( cellvalue.toUpperCase() == "QUESTION_MGMNT" ) {
		retString = "문항관리";
	}
    // 미리보기
	else if ( cellvalue.toUpperCase() == "PREVIEW" ) {
		retString = "미리보기";
	}
    // 진단명
	else if ( /(.+)/gi.test(cellvalue) == true ) {
		retString = "" + cellvalue + "";
	}
	else {
		retString = cellvalue;
	}
    
	return retString;
}

4-5번째 줄을 살펴보면 리터를 객체를 받아서 jsontext로 변경해서 붙여준다.
posted by 뚱2
참고 : http://www.json.org/js.html
Json Parser 다운 : https://github.com/douglascrockford/JSON-js

// json text -> object
var objText = '{"name":"뚱2"}';
var obj = JSON.parse(objText);

// json Object -> text
var newText = JSON.stringify(obj);

2012-02-06 추가
json text 는 꼭 key와 value를 쌍따옴표로 감싸야 한다.
그렇지 않는다면 JSON.parse를 사용했을때 정상적으로 파싱되지 않는다.
예)
// Object
JSON.parse('{"name":"뚱2"}');
// Not Object
JSON.parse("{'name':'뚱2'}");


참고 : http://itzone.tistory.com/169
posted by 뚱2
거창한건 아닙니다. 그냥 간단한 Tip입니다.
json으로 비동기 통신을 하다보면은 결과 값을 json Text로 받는 경우가 있습니다.


이걸 Javascript Object 로 변경주어야 스크립트 단에서 사용 할 수 있습니다.

    // 승인
	$("#btn_approval").click(function() {
		var selRows = $(DF.ID.GRID_MAIN).getGridParam("selarrrow");
		if ( selRows.length == 0) {
			alert("항목을 선택해 주세요.");
			return;
		}
			
		$.ajax({
		     type: 'POST'
		    ,url : DF.URL.APPROVAL
		    ,data: {id : selRows}
			,success: function(data) {
				var ret = eval("(" + data + ")");
				if (ret.success == "true") {
					alert(ret.message);
					$(DF.ID.GRID_MAIN).trigger("reloadGrid");
				}

		    }
			,error: function(result) {
		    }
		});		
	});

14번째의 줄 같이 넘어온 값을 "()"로 묶어서 eval함수를 실행해 주시면 됩니다.

* 추가 2012-02-07
eval을 사용하는건 보안상 위험이 있습니다. JSON.parse ( http://www.json.org/ ) 사용하는걸 권장합니다.




'JavaScript > Json' 카테고리의 다른 글

[JSON] douglascrockford json2.js download  (0) 2013.11.25
[JSON] JSON  (0) 2012.10.30
[Json] Json Text <-> Json Object 변환  (0) 2011.11.01
posted by 뚱2
출처 : http://jqfundamentals.com/book/index.html#chapter-1
var myFunction = function() {
    console.log('hello');
};

var myObject = {
    foo : 'bar'
};

var myArray = [ 'a', 'b', 'c' ];

var myString = 'hello';

var myNumber = 3;

typeof myFunction;   // returns 'function'
typeof myObject;     // returns 'object'
typeof myArray;      // returns 'object' -- careful!
typeof myString;     // returns 'string';
typeof myNumber;     // returns 'number'

typeof null;         // returns 'object' -- careful!


if (myArray.push && myArray.slice && myArray.join) {
    // probably an array
    // (this is called "duck typing")
}

if (Object.prototype.toString.call(myArray) === '[object Array]') {
    // Definitely an array!
    // This is widely considered as the most robust way
    // to determine if a specific value is an Array.
}



posted by 뚱2
* Javascript this에 관한 글
http://blog.mixed.kr/94


posted by 뚱2

[javascript] Closures

JavaScript/JavaScript 2011. 5. 24. 23:05
요즘 회사일로 웹프로그래밍을 하고 있습니다.
개발을 진행하다보니까 서버쪽은 정형화 되어 있어서 그나마 편하게 진행하는데
이놈은 자바스크립트가 발목을 잡네요.

그간 건성으로 form validation에만 사용하거나 약간의 UI를 컨트롤 할때 사용하던 자바스크립트.
자바스크립트로도 객체를 만들수 있고(?) 상속도 할수있다는 사실에 얼마나 놀랐던지

그중 지금도 이해가 다 되지 않고 난해한 Closures에 대한 좋은 글이 있어서 링크 걸어둡니다.

클로저를 처음 발견(?) 한 사람 더글라스 크록포드 글
http://crockford.com/javascript/private.html

낭만백수님 번역
http://mulriver.egloos.com/4666528  

클로저에 대한 소개글
http://sirini.net/blog/?p=1052

인터넷 익스플로러에서 메모리 릭
http://msdn.microsoft.com/en-us/library/Bb250448.aspx


ps. 이자릴 빌려 번역해주신 낭만백수님께 정말로 감사드립니다. 
posted by 뚱2
* Javascript Source
         
        

* html form Source
        

자바스크립트 소스의 13번 줄에 oChildNodes(i).tagName이 있는데 iE에서는 oChildNodes(i).getAttribute("tagName")으로도 호출이 되지만
크롬에서는 null을 리턴합니다.
결국 크로스브라우징을 위해서는 property 이름 그대로 사용하고 사용자 attribute만 getAttribute, setAttribute를 사용해야겠습니다.

PS. FireFox나 Safari에서는 테스트를 못했습니다. 
posted by 뚱2

1. 제   목 : 자바스크립트 완벽가이드
2. 출판사 : 인사이트
3. 저   자 : 데이비드 플래너건 저 / 송인철, 이동기, 이유원, 황인석 역
4. 가   격 : 43,000원
5. 난이도 : 중상급 (★★★★☆)
6. 판   매 : 판매중
7. 평   가 : ★★★★★

    자바스크립트 최고의 책입니다. 정말 버릴것 하나 없는 좋은 책 입니다.
    초기 대부분 웹개발자분들은 특별히 자바스크립트를 공부하기 보다는 Copy & Paste 할수있는
    수준까지 공부하는게 다였습니다.
    그런 대우를 받던 자바스크립트가 Ajax 및 인터넷의 부상으로 점점 중요해졌습니다.
    그렇지만 우리나는 여전히 관련서적이 부족합니다.
    이책은 자바스크립의 문법부터 웹브라우져와 연동되는 클라언트스크립트 부분까지
    어디 하나 버릴곳 없는 좋은 책 입니다.
    번역도 훌륭해서 읽는데 전혀 지장이 없습니다.

* 2011-05-23 추가
    다른 책에서는 보기 힘든 클로져에 대한 설명이 참으로 유용합니다.
    또한 다양한 방법으로 객체를 생성과정을 설명하는 부분도 좋습니다.
 

'Books' 카테고리의 다른 글

손에 잡히는 정규표현식  (0) 2010.01.08
제프리 리처의 Windows VIA C/C++  (0) 2009.09.14
Win32 네트워크 프로그래밍  (0) 2009.09.07
터보C정복  (0) 2009.09.06
Programming Windows with MFC Second Edition  (0) 2009.09.03
posted by 뚱2