728x90
반응형

object는 property를 가진 데이터를 저장해주며, { } 를 사용한다.
const player = {
const player = {
name : "tomato",
color : "red",
food : true
};
console.log(player);
property를 불러오는 방법은 2가지가 있다.
- console.log(player.name); => tomato
- console.log(player["name"]); => tomato
또한 property를 바꾸는 것은 가능하지만 선언된 object를 바꾸는 것은 불가능하다.
const player = {
name : "tomato",
color : "red",
food : true,
};
console.log(player);
player.color = "blue";
console.log(player.color); //-> blue
그리고 property를 추가 할 수도 있다.
player.koreanName = "토마토";
//{name: "tomato", color: "blue", food: true, koreaName: "토마토"}
player.koreanName = "토마토";
- ->
두개의 변수
const title = document.querySelector("#title");//id title을 title이라고 js 변수 설정
const BASE_COLOR = "#000000"; //상수 설정
const OTHER_COLR = "#7f8c8d"; //상수 설정
function handleClick() { //handleClick 기능을 실행한다
//(handleClick은 title에 click 실행을 하면 일어남)
const currentColor = title.style.color; // 변수 currentColor = title의 색깔은
console.log(currentColor); //currentColor 출력(현재 title의 색깔 출력됨)
if (currentColor === BASE_COLOR) { //currentColor(현재 title의 색깔)이
// BASE_COLOR(#000000)라면
title.style.color = OTHER_COLOR; //title은 OTHER_COLOR(#7f8c8d)로 출력
}
else { //BASE_COLOR(#000000)가 아니라면
// BASE_COLOR(#000000)로 title 출력
title.style.color = BASE_COLOR;
}
}
function init() { //초기화
title.style.color = BASE_COLOR;
title.addEventListener("click",handleClick); //handleClick은 title에 click 실행을 하면일어남
}
init();
728x90
반응형
'JavaScript' 카테고리의 다른 글
축약연산자 (0) | 2023.04.23 |
---|---|
date, setInterval, localStorage (0) | 2023.04.14 |
toggle (0) | 2023.04.14 |
Array (0) | 2023.04.14 |
addEventListener 활용하여 크기별로 글자 와 배경이 변하는 윈도우 창 만들기 (0) | 2023.04.13 |
댓글