0816 JavaScript Object

onnbi·2022년 9월 12일
0

front

목록 보기
10/16
post-thumbnail

JavaScript 객체

객체는 키값을 사용하여 속성(멤버변수) 식별

java 객체 map과 유사한 형태 (key:value, key:value)

const obj1 = { a : 100, b : "hello", c : true, d : [1,2,3,4]};

중괄호를 사용하여 객체를 생성한다

obj1.a = 200;
obj1["b"] = "hi";

대괄호[key] 또는 .key로 요소의 value에 접근 가능하다

const obj2 = {
    a : 100,
    b : 200,
    c : function(){
        console.log("객체 내부 함수");
        return "hihi";
    }
}

console.log(obj2.d);
// undefined

속성에 모든 자료형이 올 수 있으며, 그 중 함수 자료형인 요소를 메서드라고 한다

선언되지 않은 값을 호출하면 undefined

객체 내에서 자신의 속성을 호출할 때 반드시 this키워드를 사용한다

in

객체 안에 해당 키가 있는지 확인하는 키워드

console.log("a" in obj2); // true
console.log("b" in obj2); // true
console.log("c" in obj2); // true
console.log("d" in obj2); // false

with

해당범위 내에서 객체 이름 생략 가능하게 한다

with(obj2) {
    console.log(a);
    console.log(b);
    console.log(c());
}

object.newkey

존재하지 않는 키에 값을 넣으면 추가

사용중인 key면 덮어씌우기

obj.newKey = value;

delete object.key

객체에서 속성 삭제

console.log(obj2);
obj2.d = "안녕";
console.log(obj2);
obj2.e = function(){
    console.log("함수");
}
console.log(obj2);

// 객체에서 속성 삭제
// delete object.key
delete obj2.e;
console.log(obj2);

객체 배열

생성한 객체를 배열에 저장 가능

const dog1 = { name : "임라떼", age : 3, addr : "경기" };
const dog2 = { name : "박먼지", age : 6, addr : "서울" };
const arr = new Array();
arr.push(dog1);
arr.push(dog2);
console.log(arr);
console.log(arr[1].addr);
// 배열[인덱스].key
// arr배열 1번에 있는 객체의 addr 속성값

함수를 통한 객체 생성

리턴사용

function makeObj(param1, param2, param3){
    const obj = {
        name : param1,
        age : param2,
        addr : param3
    }
    return obj;
}

const obj1 = makeObj("임라떼", 2, "서울");

생성자사용

// 카멜 표기가 아닌 대문자로 시작 = 자바에서 클래스 만드는 것
function Student(param1, param2, param3){
    this.name = param1;
    this.age = param2;
    this.addr = param3;
}
const obj2 = new Student("강라떼", 5, "파주");
console.log(obj4);
console.log(obj4.name);	// 속성으로 접근가능
profile
aelatte coding journal

0개의 댓글