Top

01. 변수 : 데이터 저장

변수는 데이터를 저장하는 저장소 입니다. 이 저장소에는 숫자, 문자, 함수, 객체 등을 저장할 수 있습니다.

var x = 100;      //변수 x에 100을 저장
var y = 200;        //변수 y에 200을 저장
var z ="javascript"     //변수 z에 문자열 "javascript"를 저장함

document,write(x)
document,write(y)
document,write(z)
결과 보기

02. 변수 : 데이터 저장 + 데이터 변경

변수는 데이터를 저장하는 저장소 입니다. 이 저장소는 데이터를 저장, 변경할 수 있습니다.

let x = 100;
let y = 200;
let z = "javascript"

x = 300;            //변수 x의 값이 300으로 변경
y = 400;            //변수 y의 값이 400으로 변경
z = "jquary"        //변수 z의 값이 "jaquary"로 변경

document.write(x)
document.write(y)
document.write(z)
결과 보기

03. 변수 : 데이터 저장 + 데이터 변경 + 데이터 추가

변수는 데이터를 저장하는 저장소 입니다. 이 저장소는 데이터를 저장, 변경, 추가할 수 있습니다.

let x = 100;
let y = 200;
let z = "javascript"

x += 300;            //변수 x의 값에 300을 추가
y += 400;            //변수 y의 값에 400을 추가
z += "jquary"        //변수 z의 값에 "jaquary"를 추가

document.write(x)
document.write(y)
document.write(z)
결과 보기

04. 변수 : 지역 변수 + 전역 변수 + 매개 변수

전역변수는 함수 블록{} 밖이나 안에서 자유롭게 이동이 가능하지만, 지역변수는 함수 블록{} 내에서만 사용할 수 있습니다.

let x = 100;        //전역변수
let y = 200;

function func(){
    let x = 100;       //지역변수 : 함수 안에서만 작용
    let z = "javascript";
    x = 200;           //지역변수 : 함수 안의 x값이 100 -> 200
    y = 300;           //전역변수 : 함수 안에 변수 y가 선언되지 않았기 때문에 함수 밖의 y값이 200 -> 300

    document.write("함수 안");
    document.write(x);
    document.write(y);
    document.write(z);

}
func();     //함수의 실행문

document.write("함수 밖");
document.write(x);
document.write(y);
document.write(z);     //undifined (or null) : 값이 정해져 있지 않을 때 뜨는 오류
결과 보기
함수 안
200
300
javascript

함수 밖
100
300
Undifined

05. 상수 : 데이터 저장 + 데이터 변경(X)

상수는 데이터를 저장 할 수 있지만 변경 할 수 없으며, 이미 선언한 상수에 대해 중복해서 선언할 수 없습니다.

const x = 100;
const y = 200;
const z = "javascript";

// x = 300;     // 값을 변경할 수 없기 때문에 변경하는 코드를 적으면 오류가 발생
// y = 400;
// z = "jaquary";

document.write(x)
document.write(y)
document.write(z)
결과 보기

06. 배열 : 데이터 저장(여러개) : 표현 방법1

배열은 여러개의 데이터를 저장할 수 있으며 표현 방법이 다양합니다.

const arr = new Array();
arr[0] = 100;
arr[1] = 200;
arr[2] = "javascript";

document.write(arr[0]);
document.write(arr[1]);
document.write(arr[2]);    
결과 보기

07. 배열 : 데이터 저장(여러개) : 표현 방법2

배열은 여러개의 데이터를 저장할 수 있으며 표현 방법이 다양합니다.

const arr = new Array[100, 200, "javascript"];

document.write(arr[0]);
document.write(arr[1]);
document.write(arr[2]);   
결과 보기

08. 배열 : 데이터 저장(여러개) : 표현 방법3

배열은 여러개의 데이터를 저장할 수 있으며 표현 방법이 다양합니다.

const arr = [];
arr[0] = 100;
arr[1] = 200;
arr[2] = "javascript";

document.write(arr[0]);
document.write(arr[1]);
document.write(arr[2]);
결과 보기

09. 배열 : 데이터 저장(여러개) : 표현 방법4

배열은 여러개의 데이터를 저장할 수 있으며 표현 방법이 다양합니다.

const arr = [100, 200, "javascript"];

document.write(arr[0]);
document.write(arr[1]);
document.write(arr[2]);
결과 보기

10. 객체 : 데이터 저장(키와 값) : 표현 방법1

객체는 데이터 값을 필요한 대로 만들어 사용할 수 있습니다. 객체의 데이터는 '이름: 값'의 쌍으로 이루어져 있으며, 이것을 속성이라고 합니다.

const obj = new Object();
obj[0] = 100;
obj[1] = 200;
obj[2] = "javascript";

document.write(obj[0]);
document.write(obj[1]);
document.write(obj[2]);
결과 보기

11. 객체 : 데이터 저장(키와 값) : 표현 방법2

객체는 데이터 값을 필요한 대로 만들어 사용할 수 있습니다. 객체의 데이터는 '이름: 값'의 쌍으로 이루어져 있으며, 이것을 속성이라고 합니다.

const obj = new Object();
        
obj.a = 100;
obj.b = 200;
obj.c = "javascript";

document.write(obj.a);
document.write(obj.b);
document.write(obj.c);
결과 보기

12. 객체 : 데이터 저장(키와 값) : 표현 방법3

객체는 데이터 값을 필요한 대로 만들어 사용할 수 있습니다. 객체의 데이터는 '이름: 값'의 쌍으로 이루어져 있으며, 이것을 속성이라고 합니다.

const obj = {};
    
obj.a = 100;
obj.b = 200;
obj.c = "javascript";

document.write(obj.a);
document.write(obj.b);
document.write(obj.c);
결과 보기

13. 객체 : 데이터 저장(키와 값) : 표현 방법4

객체는 데이터 값을 필요한 대로 만들어 사용할 수 있습니다. 객체의 데이터는 '이름: 값'의 쌍으로 이루어져 있으며, 이것을 속성이라고 합니다.

const obj = {a:100, b:200, c:"javascript"};

document.write(obj.a);
document.write(obj.b);
document.write(obj.c);
결과 보기

14. 객체 : 데이터 저장(키와 값) : 표현 방법5 (배열 속 객체)

객체는 데이터 값을 필요한 대로 만들어 사용할 수 있습니다. 객체의 데이터는 '이름: 값'의 쌍으로 이루어져 있으며, 이것을 속성이라고 합니다.

const obj = [
    {a:100, b:200},
    {c:"javascript"}
];

document.write(obj[0].a);
document.write(obj[0].b);
document.write(obj[1].c);
결과 보기

15. 객체 : 데이터 저장(키와 값) : 표현 방법6 (객체 속 배열)

객체는 데이터 값을 필요한 대로 만들어 사용할 수 있습니다. 객체의 데이터는 '이름: 값'의 쌍으로 이루어져 있으며, 이것을 속성이라고 합니다.

const obj = {
    a: 100,
    b: [200, 300],
    c: {x: 400, y: 500},
    d: "javascript"
}

document.write(obj.a);
document.write(obj.b[0]);
document.write(obj.b[1]);
document.write(obj.c.x);
document.write(obj.c.y);
document.write(obj.d);
결과 보기

16. 객체 : 데이터 저장(키와 값) : 표현 방법7

객체는 데이터 값을 필요한 대로 만들어 사용할 수 있습니다. 객체의 데이터는 '이름: 값'의 쌍으로 이루어져 있으며, 이것을 속성이라고 합니다.

const a = 100;
const b = 200;
const c = "javascript";

const obj = { a, b, c };

document.write(obj.a);
document.write(obj.b);
document.write(obj.c);
결과 보기

17. 객체 : 데이터 저장(키와 값) : 표현 방법8

객체는 데이터 값을 필요한 대로 만들어 사용할 수 있습니다. 객체의 데이터는 '이름: 값'의 쌍으로 이루어져 있으며, 이것을 속성이라고 합니다.

const obj = {
    a : 100,
    b : [200, 300],
    c : {x:400, y:500},
    d : "javascript",
    e : function(){
        document.write("자바스크립트가 실행되었습니다.")
    },
    f : function(){
        document.write( obj.d + "가 실행되었습니다.")
    },
    g : function(){
        document.write( this.d + "가 실행되었습니다.")
    }
}

document.write(obj.a);
document.write(obj.b[0]);
document.write(obj.b[1]);
document.write(obj.b);
document.write(obj.c.x);
document.write(obj.c.y);
document.write(obj.c);
document.write(obj.d);
obj.e();
obj.f();
obj.g();
결과 보기
100
200
300
200,300
400
500
[object Object]
javascript
자바스크립트가 실행되었습니다.
javascript가 실행되었습니다.
javascript가 실행되었습니다.