자바스크립트&제이쿼리 국비수업(그린컴퓨터학원) 내용 중 객체(object)에 대해서 정리해보자

객체(object)

• 객체란
  1. 자바 스크립트 안에서의 사물
  2. 키값과 밸류값으로 구성된 프로퍼티들의 집합
  3. 프로퍼티의 구성(Key : value)
• 배열의 한계
  1. 배열의 예시 : var myscore = [90, 60, 70, 80, 08, 20, 80]
  2. 경제학이 몇 번째인지를 기억하고 있어야 점수를 뽑을 수 있다는 한계
• 객체의 문법 : { };
  var myScore = {"Korean" : 90, "Math": 100, "Science": 80};
  1. Korean 점수를 알림창에서 출력하고 싶을 때 : alert(myScore["Korean"]);
  2. 화면에 Math점수를 출력하고 싶을 때 : document.write(myScore.Math);
  3. 콘솔에 myScore 객체를 출력하고 싶을 때 : console.log(myScore);
• 객체의 활용

var cat = {
    type : "cat",
    name : "java",
    age : 2,
    photo : "1.jpg",
    character : "온순하고 활발하며 주인을 잘 따르는 성격"
   }

var dog = {
    type : "cat2",
    name : "스크립튼",
    age : 3,
    photo : "2.png",
    character : "주인을 잘 따르고 활발하고 애교가 많다"
}

document.write("<ul>");
document.write("<li>");
document.write('<img src="./img/'+cat.photo+'" alt="'+cat.name+'의 얼굴사진">');
document.write("<h3>이름 : "+cat.name+"</h3>");
document.write("<h3><p>나이 : "+cat.age+"살</h3></p>");
document.write("<h3><p>성격 : "+cat.character+"</h3></p>");
document.write("</li>");
document.write("<li>");
document.write('<img src="./img/'+cat2.photo+'" alt="'+dog.name+'의 얼굴사진">');
document.write("<h3>이름 : "+cat2.name+"</h3>");
document.write("<h3><p>나이 : "+cat2.age+"살</h3></p>");
document.write("<h3><p>성격 : "+cat2.character+"</h3></p>");
document.write("</li>");
document.write("</ul>");


</script>
<!-- <img src="./img/1.jpg" alt="자바의 얼굴사진"> >> 이것을 document.write() 괄호 안에 옮긴다고 생각하면 된다 -->
</body>
</html>

• 출력화면