필요없는 목록/JAVASCRIPT

변수, 상수, 배열, 객체 배웠던 것들 정리하기.

비밀안 2023. 2. 26. 10:27
클릭

버튼을 클릭하면 명언이 나와요

-

이름이 나와요

1.변수 : 데이터 저장(옛날 방식)

옛날 방식인 var는 변수, 상수가 동시에 가능한 타입 입니다.

변수는 데이터를 저장하는 저장소 입니다. x,y,z에 데이터를 저장하고 console.log()로 호출 중입니다.

 var x = 100;              //변수 X에 숫자 100을 저장함
 var y = 200;             //변수 y에 숫자 200을 저장함
 var z = "javascript"    //변수 z에 문자 "Javascript"를 저장함
    
console.log(x); // 100 출력
console.log(y); // 200 출력
console.log(z); // javascript 출력
  • var는 변수, 상수가 동시에 가능하기 때문에 최근에는 사용을 안하고 있습니다.(쓰는거는 가능함)
  • 최근부터는 let(변수), const(상수)를 사용합니다.

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

최근에는 let(변수)와 const(상수)를 사용합니다.

let(변수)에 데이터를 저장하고 다른 값으로 변경하고. console.log()로 호출하는 중입니다.

let x = 100; // 변수 x에 값 100을 저장 함.
let y = 200; // 변수 y에 값 200을 저장 함.
let z = "javascript"; // 변수 z에 값 javascript을 저장 함.

// x, y, z에 저장된 데이터 값을 변경합니다.
x = 300; 
y = 200;
z = "react"

console.log(x); // 300 출력
console.log(y); // 200 출력 
console.log(z); // react 출력

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

변수에 데이터를 저장 시키고. 저장된 변수에 연산을 하고. console.log()로 출력 중입니다.

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

x += 300; // x = x + 300
y += 400; 
z += "react";
// let x = "100" + 300; --- 100300 

console.log(x); // 400
console.log(y); // 600
console.log(z); // javascriptreact

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

최근에는 let(변수)와 const(상수)를 사용합니다.

상수에 데이터를 저장 후 변경 할려고 하지만 에러가 발생합니다. 

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

    x = 300;
    y = 400;
    z = "react"; 

    console.log(x); // Assignment to constant variable
    console.log(y); // Assignment to constant variable
    console.log(z); // Assignment to constant variable
    
    결과 값 : Assignment to constant variable

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

자바스크립트에서 배열을 생성하는 방법은 4개입니다. 그중 1번째 방법 입니다.

배열을 new로 생성하고. 인덱스 번호 안에 데이터를 저장하고. console.log()로 호출 중입니다.

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

console.log(arr[0]); // 100
console.log(arr[1]); // 200
console.log(arr[2]); // javascript

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

자바스크립트에서 배열을 생성하는 방법은 4개입니다. 그중 2번째 방법 입니다.

배열을 new로 생성하고. new 안에다가 데이터를 저장 시키고. console.log()로 각각의 인덱스 번호에 접근해서 호출 중입니다.

const arr = new Array(100, 200, "javascript");

console.log(arr[0]); // 100
console.log(arr[1]); // 200
console.log(arr[2]); // javascript

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

자바스크립트에서 배열을 생성하는 방법은 4개입니다. 그중 3번째 방법 입니다.

배열을 " [ ] " (대괄호)를 이용해여 생성하고. 데이터를 인덱스 번호에 저장 후 console.log()로 호출하는 예제입니다.

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

console.log(arr[0]); // 100
console.log(arr[1]); // 200
console.log(arr[2]); // javascript

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

자바스크립트에서 배열을 생성하는 방법은 4개입니다. 그중 4번째 방법 입니다.

배열을 " [ ] " (대괄호)를 이용해여 생성하고 그 안에 데이터를 저장하고. console.log()로 인덱스 번호로 호출 중입니다.

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

console.log(arr[0]); // 100
console.log(arr[1]); // 200
console.log(arr[2]); // javascript

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

자바스크립트에서 객체을 생성하는 방법은 5개입니다. 그중 1번째 방법 입니다.

객체를 new로 생성하고. 인덱스 번호 안에 데이터를 저장하고. console.log()로 호출 중입니다.

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

console.log(obj[0]); // 100
console.log(obj[1]); // 200
console.log(obj[2]); // javascript

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

자바스크립트에서 객체을 생성하는 방법은 5개입니다. 그중 2번째 방법 입니다.

객체를 new로 생성하고. 객체에 이름을 할당하여 데이터를 저장 후. console.log()로 객체의 이름에 접근하여 호출 중입니다.

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

console.log(obj.a); // 100
console.log(obj.b); // 200
console.log(obj.c); // javascript

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

자바스크립트에서 객체을 생성하는 방법은 5개입니다. 그중 3번째 방법 입니다.

객체를 " { } " (중괄호)로 생성하고. 객체에 이름을 할당하여 데이터를 저장 후 console.log()로 호출 중입니다.

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

console.log(obj.a); // 100
console.log(obj.b); // 200
console.log(obj.c); // javascript

 

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

자바스크립트에서 객체을 생성하는 방법은 5개입니다. 그중 4번째 방법 입니다.

객체를 " { } "로 생성하고 그 안에 데이터를 저장 후 console.log()로 호출 중입니다.

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

console.log(obj.a); // 100
console.log(obj.b); // 200
console.log(obj.c); // javascript

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

자바스크립트에서 객체을 생성하는 방법은 5개입니다. 그중 5번째 방법 입니다.

배열을 " [ ] " (대괄호)로 생성하고. 배열 안에다가 객체를 " { } " (중괄호)로 생성 하여 호출 중입니다.

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

console.log(arr[0].a); // 100
console.log(arr[0].b); // 200
console.log(arr[1].c); // javascript

 14. 객체 : 마지막으로 객체를 활용한 예제

객체 안에 배열, function(함수)를 생성하여 접근 후 호출하는 예제입니다.

const j = "javascript";

const obj = {
    a: 100,
    b: [200, 300],
    c: "javascript",
    d: function(){
        console.log("javascript가 실행되었습니다.");
    },
    e: function() {
        console.log(obj.c + "가 실행되었습니다.");
    },
    f: function() {
        // this : 자기 자신
        console.log(this.c + "가 실행되었습니다.");
    }
}

console.log(obj.a); // 100
console.log(obj.b[0]); // 200
console.log(obj.b[1]); // 300
console.log(obj.b[2]);  //undefind
console.log(obj.c); // javascript
console.log(obj.d); //(X)
obj.d(); // javascript가 실행되었습니다.
obj.e(); // javascript가 실행되었습니다.
obj.f(); // javascript가 실행되었습니다.