JAVA SCRIPT




  • <script type="text/javascript">

-> 자바 스크립트 타입으로 지정


  • "use strict";

- 브라우저에게 자바스크립트를 엄격하게 검사할 것을 요구.

- 최신의 브라우저에 추가된 명령어로, "" 넣은 이유는 이전 브라우저에서

오류가 발생할 수 있기 때문에 미연의 방지차 정의 된 것이다.



  • 배경지식

- 변수는 페이지 단위로 관리된다.

- 페이지와 페이지 사이에는 절대 공유할 수 없다.

- 글로벌 변수 => 그 페이지 내에서 어디서든 접근할 수 있는 변수






변수와 자료형




- 변수 선언: 데이터형을 선언하지 않는다.

var a;                        // 변수에는 어떤 값을 넣을 수 있는가? - 마음대로.

a = 10; // number 데이터형

a = "홍";         // string 데이터형

a = true;         // boolean 데이터형

a = new Object(); // Object 데이터형

a = function() {}; // function 데이터형

- 출력: 브라우저의 콘솔 창으로 출력할 수 있다.

console.log(10); // 개발하는 동안 확인용으로 사용한다.




  • 바인딩이란?

- 변수의 데이터형의 결정되는 것.

- 값을 할당한 후 결정 된다.


var b;    // 바인딩 안되어 있는 상태: undefined

// 해당 변수에 값이 할당되지 않은 상태. 즉, 데이터형이 결정되어 있지 않은 상태.


console.log(b);

- 변수의 데이터형 알아내기: 바인딩 된 후 변수의 데이터형 확인 typeof()


b = 10;

console.log(typeof(b));


b = 10.5;

console.log(typeof(b));

- 동적 바인딩(dynamic binding <> static binding)

-> 예시) Java, C, C++, C#

- 변수의 데이터 형은 고정되어 있지 않다. 값을 할당하는 순간 결정되기 때문이다.

- 값을 할당할 때 데이터형이 결정되는 것.

- 가능한 변수의 용도를 결정했으면 그대로 사용.






자료형 검사: typeof()

자료형: null, undefined




b = "홍길동";

console.log(typeof(b));



b = true;

console.log(typeof(b));


b = null;

console.log(typeof(b));



b = new Object();

console.log(typeof(b));



b = function() {};

console.log(typeof(b));

- 이전 자바스크립트 명세에서는 var을 선언하지 않고 만든 변수는 글로벌 변수로 설정.

- 현재는 반드시 var을 붙여야 한다.

- 브라우저에게 자바스크립트 문법을 엄격하게 검사할 것을 요구. 'use strict";




  • 중복 선언?

- 오류가 아니다. 기존 변수 덮어쓴다.

var c = 10;

console.log(typeof(c));


var c = "홍길동";

console.log(c);



window 객체: 브라우저에 미리 정의된 객체

-> 브라우저의 정보를 다루는 객체

  • 글로벌 변수나 함수를 포함하고 있다.
  • 글로벌 변수는 모두 window 객체의 프로퍼티로 포함된다.
  • 글로벌 함수도 또한 모두 window 객체에 포함된다.

console.log(window.c);


var d = 20;

window.e = 30;


console.log(e);                                // e앞에 window 객체 레퍼런스가 생략된 것.

console.log(window.e);





기본 라이브러리

prompt(), confirm(), alert()



prompt()

prompt 리턴값은 string이다.


var r = prompt("당신의 나이는?");

console.log(r);



var r2 = confirm("당신은 비트 수강생입니까?", "제목입니까?");

console.log(r);



alert("오호라... 단순 메시지 출력할 때 사용");






배열: [ , , , ]


var names = ["홍길동", "임꺽정", "유관순", 20, function(){}, true];

for(var i = 0; i < names.lenght; i++){

console.log(names[0]);

}





    ==와 ===의 차이


var x1 = 20;

var x2 = "20";

if(x1 == x2){                                // 암시적 형변환이 발생함.

console.log("x1 == x2");

}


암시적 형변환 없이 정확하게 데이터형과 값이 일칳나는지 확인하고 싶다면?

if(x1 === x2){

console.log("x1 === x2");

} else {

console.log("x1! ==  x2");

}





console.log('52 + 273');            // 1번


console.log(52 + 273);              // 2번


console.log(parseInt('52') + 273);            // 3번: parseInt로 썼을 경우 데이터형으로 변환한다.

        

console.log(52 + '273');            // 4번


console.log('52' + '273');            // 5번





조건 연산자


var a = (20 > 30) ? "와우 정말?! ㅎㅎ" : "어후,,,";

console.log(a);




||와 &&의 다른 활용

var x = 20;


var b = true || (x = 30);

console.log(x, b);


var b = false || (x = 30);

console.log(x, b);


var age = prompt("니 나이 몇이냐?", "18");

// (age > 18) || console.log("미성년자입니다.");

(age < 19) && console.log("미성년자입니다.");





'학습정리 > by aking' 카테고리의 다른 글

사이트정리  (0) 2013.07.21
안드로이드 NFC  (0) 2013.07.19
HTML & CSS  (0) 2013.06.25
(수정중) GIT Server 구축 및 Log4J 설정  (0) 2013.06.24
by aking 2013. 7. 9. 18:34
| 1 |