객체(object)
실생활에서 우리가 인식할 수 있는 사물들을 객체라고 부른다.
사람, 강아지, 고양이, 도마뱀 등등......
- 요것이 객체 빠밤~!!! -
내가 거미의 정보에 대해 표현하고 싶다면 메모리에 명사와 동사를 싹 묶어서 올려놓는 것 이것이 객체
let 머리개수 = 1
let 키 = 180
let 다리개수 = 2
...
function 달리기() {
열심히 달립니다.
}
function 먹기() {
맛있게 먹습니다.
}
const dragon = { } //빈 객체
const dragon = {
name: "불주먹",
age: 40,
color: gray,
sleep: function() {
consol.log('잠을 잡니다');
}
...
}
name: "불주먹" = 이름과 값으로 이루어진 (property) 집합
그러니까 기본 타입은 객체이고, 객체란 이름과 값으로 구성된 프로퍼티의 정렬되지 않은 집합이다.
프로퍼티의 값으로 함수도 올 수 있는데, 이를 프로퍼티 메소드라고 부른다.
1. 리터럴 표기법
단점: 객체를 여러개 생성하기 힘들다.
1. 리터럴 표기법
자바스크립트에서 객체를 만드는 가장 쉬운 방법
const 객체를 = {
프로퍼티명: 프로퍼티값,
...
...
}
2. 생성자를 이용한 객체생성
2. 생성자를 이용한 객체생성
new 연산자를 사용허여 객체를 생성하고 초기화할 수 있음. 이 때 사용되는 메소드를 생성자라고 하며, 이
메소드는 새롭게 생성되는 객체를 초기화하는 역할을 함.
function 생성자명(매개변수1, 매개변수2 ..) {
프로퍼티명 = 값;
...
...
}
const 객체명 = new 생성자명(값1, 값2..);
3. 클래스를 이용한 객체생성
제일 많이 쓰는 방법 중에 하나.
3. 클래스를 이용한 객체생성
const 클래스명 = class {
constructor(매개변수1, 매개변수2 ..){ //저장할 변수, 함수, 메소드 정의
프로퍼티명 = 값;
...
...
}
메소드명(매개변수1, 매개변수2 ..){
}
...
}
const 객체명 = new 클래스명(값1, 값2 ..);
- 여기서 생각해볼 점 -
배열과 객체의 차이점
예제1)
const dog = {
name: "루시",
age: 10,
color: "white",
weight: 3.5,
};
console.log(dog.name); //dog라는 객체를 참조변수가 가리키고 있고, 그안에 name이라는 key값 가져오기.
console.log(dog.age); //.을 사용해서 그안에 변수 가져오기
console.log(dog.color);
console.log(dog.weight);
위에 방법 말고 배열 타입으로도 가져올 수 있다.
console.log(dog["name"])은 위에 콘솔과 비교 했을 때 어떤 점이 다른가에 대해서 한번 생각해 볼 수 있다.
여기서 for문은 i가 index를 가지고 dog는~까지 반복문을 돌린다는 의미인데
여기서 log(i)와 (dog[i])를 출력 해보면
key값을 가져오는거와 value를 가져오는 차이를 볼 수 있다.
또 다른 예제보기,함수를 호출 해보기.
return받았으니 그 값이 memberId로 내려와서 출력되는 것.
const user = {
userid: "apple",
name: "김사과",
gender: "여자",
hp: "01011111111",
birthday: "20001211",
memberId: function () {
return "korea" + this.hp;
},
};
console.log(user.userid);
console.log(user.name);
console.log(user.gender);
console.log(user.hp);
console.log(user.birthday);
console.log(user.memberId());
또, 함수를 실행하고 다시 memberId를 실행하면 함수가 저장 되어 있는걸 볼 수 있다.
[자바스크립트] 함수의 종류 알아보기 (0) | 2023.06.03 |
---|---|
[자바스크립트] 자바스크립트에서 제일 중요한 Document객체 (0) | 2023.06.01 |
[자바스크립트] Array(배열) (0) | 2023.05.30 |
[자바스크립트] 2. 반복문 while 문 (0) | 2023.05.30 |
[자바스크립트] 1. 제어문 조건문 - if 문, if-else 문, switch문 (0) | 2023.05.28 |
댓글 영역