- 01. 변수 : 데이터 불러오기
- 02. 상수 : 데이터 불러오기
- 03. 배열 : 데이터 불러오기
- 04. 배열 : 데이터 불러오기 : 2차 배열
- 05. 배열 : 데이터 불러오기 : 갯수 구하기
- 06. 배열 : 데이터 불러오기 : for( )
- 07. 배열 : 데이터 불러오기 : forEach( )
- 08. 배열 : 데이터 불러오기 : for of( )
- 09. 배열 : 데이터 불러오기 : for in( )
- 10. 배열 : 데이터 불러오기 : map( )
- 11. 배열 : 데이터 불러오기 : 펼침연산자
- 12. 배열 : 데이터 불러오기 : 배열 구조 분해 할당
- 13. 객체 : 데이터 불러오기 : 기본
- 14. 객체 : 데이터 불러오기 : Object
- 15. 객체 : 데이터 불러오기 : 변수
- 16. 객체 : 데이터 불러오기 : for in
- 17. 객체 : 데이터 불러오기 : map( )
- 18. 객체 : 데이터 불러오기 : hasOwnProperty( )
- 19. 객체 : 데이터 불러오기 : 펼침연산자 - 복사
- 20. 객체 : 데이터 불러오기 : 펼침연산자 - 추가
- 21. 객체 : 데이터 불러오기 : 펼침연산자 - 결합
- 22. 객체 : 데이터 불러오기 : 객체 구조 분해 할당
- 23. 객체 : 데이터 불러오기 : 비구조화 할당 : 별도 이름 저장
01. 변수 : 데이터 불러오기
{
var x = 100;
var y = 200;
var z = "javascript";
document.write(x);
document.write(y);
document.write(z);
}결과보기
dd
02. 상수 : 데이터 불러오기
{
const x = 100, y = 200, z = "javascript";
document.write(x);
document.write(y);
document.write(z);
}결과보기
ddd
03. 배열 : 데이터 불러오기
{
const arr = [100, 200, "javascript"];
document.write(arr[0]);
document.write(arr[1]);
document.write(arr[2]);
}결과보기
04. 배열 : 데이터 불러오기 : 2차 배열
{
const arr = [100, 200, ["javascript", "jquery"]];
document.write(arr[0]);
document.write(arr[1]);
document.write(arr[2]);
document.write(arr[2][0]);
document.write(arr[2][1]);
}결과보기
ddd
05. 배열 : 데이터 불러오기 : 갯수 구하기
{
const arr = [100, 200, "javascript"];
document.write(arr.length);
}결과보기
ddd
06. 배열 : 데이터 불러오기 : for( )문
{
const arr = [100, 200, 300, 400, 500];
document.write(arr[0]);
document.write(arr[1]);
document.write(arr[2]);
document.write(arr[3]);
document.write(arr[4]);
// for(초기값; 조건식; 증감식)
for (let i = 0; i<arr.length; i++){
document.write(arr[i], "<br>");
}
}결과보기
ddd
07. 배열 : 데이터 불러오기 : forEach( )
{
const num = [100, 200, 300, 400, 500];
document.write(num[0]);
document.write(num[1]);
document.write(num[2]);
document.write(num[3]);
document.write(num[4]);
// for 문
for( let i = 0; i<num.length; i++ ){
document.write(num[i],"<br>");
}
// for each ( )
num.forEach(function(el){
document.write(el, "<br>");
});
//forEach(element, index, array)
num.forEach(function(element, index, array){
document.write(element);
document.write(index);
document.write(array);
})
}결과보기
ddd
08. 배열 : 데이터 불러오기 : for of( )
{
const num = [100, 200, 300, 400, 500];
for (let i of num) {
document.write(i);
}
}결과보기
ddd
09. 배열 : 데이터 불러오기 : for in( )
{
const num = [100, 200, 300, 400, 500];
for (let i of num) {
document.write(i);
}
for (let i in num) {
document.write(num[i]);
}
}결과보기
ddd
10. 배열 : 데이터 불러오기 : map( )
{
const num = [100, 200, 300, 400, 500];
num.map(function (el) {
document.write(el);
});
//map(element, index, array){
num.map(function (element, index, array) {
document.write(element);
document.write(index);
document.write(array);
});
}결과보기
ddd
11. 배열 : 데이터 불러오기 : 펼침연산자(Spread Operator)
{
const num = [100, 200, 300, 400, 500];
document.write(num);
document.write(num[0], num[1], num[2], num[3], num[4]);
document.write(...num);
}결과보기
ddd
12. 배열 : 데이터 불러오기 : 배열 구조 분해 할당
{
let a, b, c;
[a, b, c] = [100, 200, "javascript"];
document.write(a);
document.write(b);
document.write(c);
}결과보기
ddd
13. 객체 : 데이터 불러오기 : 기본
{
const obj = {
a: 100,
b: 200,
c: "javascript"
}
document.write(obj.a, "<br>");
document.write(obj.b, "<br>");
document.write(obj.c, "<br>");
document.write(obj['a']);
document.write(obj['b']);
document.write(obj['c']);
}결과보기
ddd
14. 객체 : 데이터 불러오기 : Object
{
const obj = {
a : 100,
b : 200,
c : "javascript"
}
document.write(Object.keys(obj));
document.write(Object.values(obj));
document.write(Object.entries(obj));
}결과보기
15. 객체 : 데이터 불러오기 : 변수
{
const obj = {
a : 100,
b : 200,
c : "javascript"
}
const name1 = obj.a;
const name2 = obj.b;
const name3 = obj.c;
document.write(name1);
document.write(name2);
document.write(name3);
}결과보기
16. 객체 : 데이터 불러오기 : for in
{
const obj = {
a: 100,
b: 200,
c: "javascript"
}
for( let key in obj){
document.write(obj[key]);
}
}결과보기
17. 객체 : 데이터 불러오기 : map( )
{
const obj = [
{a: 100, b: 200, c: "javascript"}
]
obj.map(funxtion(el){
document.write(el.a, "
")
document.write(el.b, "
")
document.write(el.c, "
")
});
}결과보기
18. 객체 : 데이터 불러오기 : hasOwnProperty( )
{
const obj = {
a: 100,
b: 200,
c: "javascript"
}
document.write(obj.hasOwnProperty('a'));
document.write(obj.hasOwnProperty('b'));
document.write(obj.hasOwnProperty('c'));
document.write(obj.hasOwnProperty('d'));
document.write('a' in obj);
document.write('b' in obj);
document.write('c' in obj);
document.write('d' in obj);
}결과보기
19. 객체 : 데이터 불러오기 : 펼침 연산자 - 복사
{
const obj = {
a: 100,
b: 200,
c: "javascript"
}
const spread = { ...obj }
document.write(spread.a)
document.write(spread.b)
document.write(spread.c)
}결과보기
20. 객체 : 데이터 불러오기 : 펼침 연산자 - 추가
{
const obj = {
a: 100,
b: 200,
c: "javascript"
}
const spread = { ...obj, d: "jquery" }
document.write(spread.a)
document.write(spread.b)
document.write(spread.c)
}결과보기
21. 객체 : 데이터 불러오기 : 펼침 연산자 - 결합
{
const objA = {
a: 100,
b: 200,
}
const objB = {
c: "javascript",
d: "jquery",
}
const spread = { ...objA, ...objb }
document.write(spread.a)
document.write(spread.b)
document.write(spread.c)
document.write(spread.d)
}결과보기
22. 객체 : 데이터 불러오기 : 비구조화 할당
{
const obj = {
a: 100,
b: 200,
c: "javascript"
}
const { a,b,c } = obj;
document.write(spread.a);
document.write(spread.b);
document.write(spread.c);
}결과보기
23. 객체 : 데이터 불러오기 : 비구조화 할당
{
const obj = {
a: 100,
b: 200,
c: "javascript"
}
const { a:name1, b:name2, c:name3 } = obj;
document.write(name1);
document.write(name2);
document.write(name3);
}