object 1

TIL

object 1

은지:) 2022. 7. 22. 08:15

728x90

👆요 표를 js 언어로 데이터 구현시 아래와 같이 데이터 저장이 필요하다

let plan1Name = "Basic";
let plan1Price = 3.99;
let plan1Space = 100;
let plan1Data = 1000;
let plan1Pages = 10;
let plan2Name = "Professional";
let plan2Price = 5.99;
let plan2Space = 500;
let plan2Data = 5000;
let plan2Pages = 50;
let plan3Name = "Ultimate";
let plan3Price = 9.99;
let plan3Space = 2000;
let plan3Data = 20000;
let plan3Pages = 500;

plan[]Name

plan[]Price

plan[]Space

plan[]Data

plan[]Pages

이 반복되는데...

이를 쓰려면

alert(plan2Name + "플랜 가격은 한 달에 " + plan2Price + "달러입니다.")

alert("용량은 " + plan2Space + "GB이고, ...");

변수 나열이 몹시 필요해 보인다 😅

데이터가 늘어나면 늘어날 수록 코드도 길어지고 관리하기 힘든데 이를 해결하기 위해 객체를 쓴다

plan1{}

plan2{}

plan3{}

라는 3 묶음 안에

각 객체는 (예를 들어 plan1은)

{

name : basic,

price : 3.99,

space : 100,

transfer : 1000,

pages : 10

}

'키 : 값' 형태를 가진다

👇 이런 형태

let plan1 = {
  name: "Basic",
  price: 3.99,
  space: 100,
  transfer: 1000,
  pages: 10
};

객체 접근

객체에 접근 하기 위해선 밑의 문법을 보면 된다.

let plan1 = {   
  name: "Basic"
};

let propertyName = "name"; // propertyName 함수에 값 name(plan1 속성값과 이름 동일)

console.log(plan1[propertyName]); // plan1[name]

let myObj = {
  property1: "hello",
  property2: [1,2,3,4,5],
  property3: {
    childproperty: "haha"
  }
};


// 👆 이 객체에 접근하려 한다


let name = "property";
console.log(myObj[name+"1"]); // property1
console.log(myObj[name+"2"]); // property2
console.log(myObj[name+"3"]); // property3
console.log(myObj[name+"3"]["child"+name]); // property3[childproperty] 의 값은 'haha'

console.log(myObj.property1);
console.log(myObj.property2);
console.log(myObj.property3);
console.log(myObj.property3.childproperty);

객체 + 배열

let objData = {
  name: 50,
  address: { 
    email: "gaebal@gmail.com",
    home: "위워크 선릉2호점"
  },
  books: {
    year: [2019, 2018, 2006],
    info: [{
      name: "JS Guide",
      price: 9000
    }, {
      name: "HTML Guide",
      price: 19000,
      author: "Kim, gae bal"
    }]
  }
};

👆 'html guide'에 접근

let bookName = objData.books.info[1].name;
console.log(bookName);

objData 변수명

.books 객체

info 속성 "info>배열>객체"

[1] 인덱스 번호

.name 속성

replit 문제

처음 볼 땐 문제를 이해하지 못했다... 💩

그래서 일단 자료를 아예 표로 만들어보았는데 (세부내용은 임의로 적음!)

이 틀 안에서 인자 (salesArr,reviewArr,likeArr) 를 찍어내면 될 거 같았다.

function getData(salesArr,reviewArr,likeArr){ // 3개의 인자 (배열값)
  

// 속성값만 지정해서 객체 만들기, 객체 이름은 reuslt로 정해주었다 

  reuslt = { 
    sumAmount : 0, 
    sumReview : 0,
    sumLike : 0,
  };

// 배열에 반복문 돌려서 (length 는 어차피 다 같으니 가장 앞에 있는 SalesArr 를 씀)

   for(let i = 0; i < salesArr.length; i++){
    reuslt.sumAmount += salesArr[i][1];
    reuslt.sumReview += reviewArr[i][1];
    reuslt.sumLike += likeArr[i][1];
  }
  
  
// 비어 있는 reuslt 객체
// reuslt.sumAmount 속성값 위치 설정
// 받은 salesArr,reviewArr,likeArr 인자들 [[],[],[]] 배열 안에 배열이 형태니 [i][1] 를 넣어준다


return reuslt;

// reuslt 리턴!

이렇게 되면

이렇게 가로로 하나하나씩 값이 만들어지는 것...!!!!!

728x90