22.06.30 - [ JS ] [ 객체 ] 선언, 메소드, 반복문, 속성, 배열, 내장객체

 

-- Index --

 

객체
선언	메소드	반복문	속성 추가/제거	배열	내장객체

 

 

 

 

---

 

 

 

1. 객체 선언

• var x = { };
• var x = new Object();

 

 

 

 

1-1 속성명으로 [  ] 사용하는 경우의 주의 사항

• [ ] 사용시 ‘’이걸로 문자열이라고 인식시켜줘야한다.)
• [ ] 사용시 변수를 사용 가능 // [ ] 사용시 공백도 포함가능
• 특수문자도 사용가능!

 

 

---

 

1-2 객체 안에는 key:value형식으로 모든 것 넣어줄 수 있다. ( 배열/함수/객체 등 )

• key / value 테스트
• key값에는 기본적으로 문자열로 인식한다. - 문자열만 가능하다.
• pName에 ‘pName’ 안해줘도 문자열로 인식한다!
• value는? 문자열도있고, 넘버도있고, 타입이 상관없다.
• (string,number,boolean,object,array,funftion)

 

 

 

 

 

 

---

 

 

 

 

2. 객체의 메소드

 

객체의 메소드란?

• 객체에 함수 집어넣어서 호출-실행하는거
• product.f01()   :::::::::::: product.f01 - X

 

 

 

 

 

---

 

 

 

 

3. 객체의 반복문

• 객체와 반복문을 활용 -  객체의 모든 속성을 출력 가능

 

 

# 실습

1. game 변수에 객체 넣어주기
2. fon in 사용해서 요소 다 꺼내보기 - ( 객체는 인덱스가 없지않나요? )
3. in 뒤에 값으로 object를 사용하면 – 인덱스가 아닌 key값을 하나하나 전달해준다.

 

 

### 모든 속성 key값 접근 가능하다. == 모든 요소 출력가능하다 ~! ###

>> key라는 변수를 사용해서 출력하는 것이므로 [ ] <- 요걸로 사용 <<

 

---

 

# key / value 같이 출력

• [ `` ]와 [ ${} ] 사용해서 코드 작성

 

 

 

 

 

---

 

 

 

 

4. 객체의 속성 추가 및 제거

 

 

 

4-1 객체 속성 추가 . [ ]

• x.name = ~~ /// x.age = ~~
• x[height] = ~~ /// x[age year] = ~~
• 변수를 사용하거나 공백 / 특수문자 포함된
• 속성명 사용하는 경우에  .(점) 말고 [ ] 사용

 

 

>> 빈 객체 생성 후 속성 추가 - 출력 테스트 <<

 

 

---

 

4-1 객체 속성 제거 - delete( )

• delete(객체.속성) :::::::::: 객체에 있는 속성 삭제
•  '속성' in 객체 :::::::::: 객체안에 key값이 존재하는지 확인 - true / false 반환

 

 

>> 객체 속성 삭제 후 출력 테스트 <<

 

 

key값 존재하는지 확인 -> (삭제전) height속성있다고 true 나옴

key값 존재하는지 확인 -> (삭제후) height속성없다고 false나옴

 

 

 

 

---

 

 

 

 

5. 객체배열

• 일반 배열 처럼 push()와 pop()사용 가능
• 다만 { } 객체 - key:value형식으로 사용

 

 

 

 

 

---

 

 

 

 

6. 내장객체

 

 

6-1 Object 객체

• JS의 가장 기본적인 내장 객체
• 객체 생성시 안 넣어주었던 함수를 사용할 수 있는 이유는?
• Object 객체 만들면 Object 프로토타입 복사해서 만드는 것이다.
• 부모가 가지고있던 함수 자식들도 사용 가능!

 

 

---

 

6-2 Number 객체

 

 

---

 

6-3 String 객체

 

 

---

 

6-4 Date 객체

 

 

 

date2 - new Date(12345678933333);

• 숫자에 해당하는 날짜 시간 분 초로 바뀌어서 출력됨
• 단위는 ms/ 1970년-1-1 기준으로 ms 단위로 시간 계산

 

date5 – new Date(2022, 00, 01, 20, 07, 30);

• 7월햇는데 8월로 나옴
• >>0으로 테스트 – 아하~ 0부터 시작하는구나~

 

 

>> 현재 날짜 객체에서 .getDay() /.getMonth()/.getHours() 등으로 원하는 값 가져올 수 있다. <<

 

 

 

---