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 = "jquery"; //변수 z의 값이 "jquery"로 변경됨
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 += "jquery" //변수 z에 "jquery"를 더해줌
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; //지역변수 100 -> 200
y = 300; //전역변수 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);
결과보기
200
300
javascript
함수 밖
100
300
undifined
05. 상수 : 데이터 저장 + 데이터 변경(X)
상수는 데이터를 저장 할 수 있지만 변경은 할 수 없습니다.
const x = 100;
const y = 200;
const z = "javascript";
//x = 300; //변경할 수 없음
//y = 400;
//z = "jquery";
document.write(x);
document.write(y);
document.write(z);
결과보기
06. 배열 : 데이터 저장(여러개) - 표현방법1
배열이란, 이름과 인덱스로 참조되는 정렬된 값의 집합입니다. 즉, 같은 자료들을 담는 자료구조 중 하나입니다. 배열에 들어있는 값을 요소(element)라고 하며, 배열의 순서를 인덱스(index)라고 합니다. 배열은 0부터 시작합니다.
const arr = new Array(); //선언
arr[0] = 100; //첫 번째 인덱스에 100을 저장
arr[1] = 200; //두 번째 인덱스에 200을 저장
arr[2] = "javascript"; //세 번째 인덱스에 "javascript"를 저장
document.write(arr[0]);
document.write(arr[1]);
document.write(arr[2]);
결과보기
07. 배열 : 데이터 저장(여러개) - 표현방법2
표현방법1처럼 데이터를 하나씩 넣지 않고 한꺼번에 저장합니다.
const arr = new Array(100, 200, "javascript"); //괄호 안에 모두 넣음
document.write(arr[0]);
document.write(arr[1]);
document.write(arr[2]);
결과보기
08. 배열 : 데이터 저장(여러개) - 표현방법3
new Array를 선언하지 않고 대괄호[]를 이용해 데이터를 저장합니다.
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]);
결과보기
09. 배열 : 데이터 저장(여러개) - 표현방법4
대괄호[]안에 모든 데이터를 저장합니다.
const arr = [100, 200, "javascript"]
document.write(arr[0]);
document.write(arr[1]);
document.write(arr[2]);
결과보기
10. 객체 : 데이터 저장(키와 값) - 표현방법1
객체란, 키(key)과 값(value)으로 구성된 요소(Property)들의 집합입니다. 배열은 순서를 가지지만 객체는 의미를 가집니다.
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
배열과 다른 방법으로 obj. 를 이용합니다. newObject() 선언합니다.
const obj = new Object();
obj.a = 100; //a가 키 100이 값
obj.b = 200;
obj.c = "javascript";
document.write(obj.a);
document.write(obj.b);
document.write(obj.c);
결과보기
12. 객체 : 데이터 저장(키와 값) - 표현방법3
new Object를 생략하고 중괄호{}를 이용합니다.
const obj = {}
obj.a = 100; //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()
결과보기
200
300
200,300
400
500
[object Object]
javascript
자바스크립트가 실행되었습니다.
javascript가 실행되었습니다.
javascript가 실행되었습니다.