20180407 자바스크립트 변수 및 객체 알아보기.

자바스크립트(JavaScript)

HTML 문서에 적용할 때 웹 사이트에 동적 상호작용을 제공할 수 있는 동적 프로그래밍 언어이다. (Dynamic Client-Side Scripting)

변수 자료형

• String
  - 문자열, 문자열을 변수로 나타내기 위함

• Number
  - 숫자

• Boolean
  - true/false에 대한 불리언 타입

• Array
  - 배열 형태

• Object
  - JavaScript의 모든 것은 객체이며, 변수에 저장이 가능하다.

아래와 같이 이용할 수 있다.

// '//' 스크립트 창에서 주석을 표시할 수 있도록 한다.
 
var x = 5;
console.log(5);
console.log("==========================\n");
 
/** 자바스크립트 내 변수 타입 **/
x = 1;
x = 0.01;
x = "Hello World";
x = "JavaScript";
x = true;       // boolean
x = false;      // boolean
x = null;       // null 
x = undefined;  // null 과 유사
 
 
/** 
- 자바스크립트 내 객체 타입 
- 중괄호 내부에 name:value의 쌍으로 표시
**/
var book = {
  topic:"JavaScript",
  step:0,
  fat:true
}
 
 
/** 객체 내부 value 값 접근 4가지 방식 **/
console.log("(1) " + book);
console.log(book);
console.log("(2) " + book.topic);
console.log("(3) " + book["step"]);
console.log("(4) " + book['fat']);
console.log("(5) " + book.fat);
console.log("==========================\n");
 
/** 배열도 구현이 가능 **/
var numbers = [1, 2, 3, 4, 5];
console.log(numbers);
console.log(numbers[0]);
console.log(numbers[1]);
console.log(numbers[2]);
console.log("numbers length : " + numbers.length);
 
numbers[0] = 1000;
console.log(numbers[0])
var emptyArray = [];
console.log("emptyArray length : " + emptyArray.length);
console.log("==========================\n");

console.log는 해당 브라우저 디버그 콘솔에서 확인할 때 이용하는 명령어이다. 출력된 값을 확인하면 아래와 같다.

5
==========================
 
(1) [object Object]
{ topic: 'JavaScript', step: 0, fat: true }
(2) JavaScript
(3) 0
(4) true
(5) true
==========================
 
[ 1, 2, 3, 4, 5 ]
1
2
3
numbers length : 5
1000
emptyArray length : 0
==========================