내일배움캠프 13일차 개발일지

김광훈·2021년 9월 28일
3

TIL(Today I Learned)

목록 보기
12/49

쉬어가기😑

날이 지나 프로젝트가 어느정도 마무리되어간다. 프로젝트가 끝을 향해 다가갈 수록 커다란 작업들은 끝이나고 작고 골치아픈 문제들만 남기 시작했다. 물론 해결하지 못할 건 아니지만, 문제를 처리하고도 뭔가 게운한 느낌이 들지가 않는다. 마치 100만큼의 일을 하다가 60~70의 일만 한 느낌이다.😅

  • 프로젝트 상세페이지 재료레시피 부분 프론트 수정
  • 프로젝트 레시피 카드 정렬 틀어짐 문제 수정

오늘은 용어 정리를 해보자

  • 객체, 속성, 메소드에 대해서 알아보자

🛒본론

⚙객체(object)

객체(object)란 실생활에서 우리가 인식할 수 있는 사물로 이해한다고 하는데 쉽게 코드로 알아보자.

<script>
let myName = {
	firstName: "Su",
	lastName: "Han"
}
</script>

myName라는 변수에 { }로 감싼 이 덩어리가 객체이다.

⚙속성(property)

객체 안을 보면 firstName: "Su"와 lastName: "Han"이 쉼표를 기준으로 구분되어 있다. 바로 이 쉼표로 구분되어 있는 것들이 속성이다.
즉 위 객체의 속성은

  • firstName: "Su"
  • lastName: "Han"

이렇게 두가지가 되는 것이다.

이때, 속성에서 firstName,lastName은 키(key), "Su","Han"은 값(value)라고 한다.
키(key) 위치에는 문자열만 입력이 가능하며 띄어쓰기가 없다면 따옴표("")를 기입하지 않아도 된다.
값(value) 위치에는 어떤 값이 들어가든 상관 없다.

속성은 다음과 같이 사용할 수 있다.

<script>
let obj = {
a:1,
b:2
};
obj.a
obj.a // 1
obj["b"] // 2
</script>

⚙메소드(method)

객체 안에 속성값으로 함수가 들어간 것을 메소드라고 한다. 메소드는 다음과 같이 사용할 수 있다.

<script>
let obj = {
method1 : function(){
console.log('test');
}
};

obj.method1() // test
</script>

✔생각 정리

기능을 사용하고 싶어서 구글링을 하다보니 전문적인 용어가 너무 많이 나와 여차저차 가져다 써도 이해가 안되는 경우가 많이 발생했었다. 생각해보니 너무 겉핥기식으로 알고 있는 정보들이 너무 많았던거 같다. 객체와 속성에 대해서도 깔끔하게 풀어내지 못하는걸 보니 제대로 알고 있지 않았구나라는 생각에 많이 부족하다는걸 느낄 수 있었다.

  • 용어 정리부터 차근차근 시작해보자.
  • 내일은 document에 대해서 알아보자.

[참조]
https://www.zerocho.com/category/JavaScript/post/572c6f759a5f1c4db2481ee3

profile
잘 부탁드려요

0개의 댓글