객체의 쓰기와 읽기
객체와 반복문
프로퍼티와 메소드
댓글
-
객체와 반복문까지 보았는데, JavaScript의 객체는 다른언어의 Map 자료구조와 비슷한 느낌이네요!... -
완료
-
완료
-
머릿속이 마치 정돈된 서랍장을 쾅 닫앗을 때처럼 된것 같네요..
-
감사합니다. 완료
-
this
-
완료 감사합니다:)
-
완료!감사합니다 "객체":"프로퍼티"
-
완료
-
완료
-
객체는 배열과 다르게 순서없이 담을 수 있는 성질을 갖았다.
객체는 숫자,문자뿐만 아니라 함수도 담을수 있다. -
감사합니다. 진도가 정말 빨라서 일취월장하는거 같습니다.
-
감사합니다. -
잘 모르겠습니다 하지만 계속 가겠습니다 ㅜㅜ
-
안녕 난 객체라고해
세상의 모든것을 담을수 있지
나와 함께라면 두려울게 없어 -
꿀재미 입니다
-
감사합니다.
-
[객체]
순서가 있게 정보를 저장하는것이 배열(array)라면
순서가 없이 정보를 저장할수있는것이 객체이다.
배열은 [] 객체는 {}
var coworkers={"warrior":"changmin"}
{key값 : value값} // 내부에 들어가는 'warrior:changmin' 이 한덩어리를 property (속성값)이라고한다.
<h2>Coworkers</h2>
<script>
var coworkers={"warrior":"changmin",
"magiction":"abc",
"tanker":"qqwerr",
["mad scientist"]:"yezi"}; //띄어쓰기가 되어있을 경우 괄호를 씌워 줘야 한다.
document.write("warrior : "+coworkers.warrior+"<br>");// '.' 점은 오브젝트 엑세스 오퍼레이터라고한다. 즉 객체에 접근하기위한것//
document.write("magiction : "+coworkers.magiction+"<br>");
document.write("tanker : "+coworkers.tanker+"<br>");
document.write("mad scientist : "+coworkers["mad scientist"]+"<br>"); //띄어쓰기가 되어있을경우는 오브젝트 오프레이터로
//불러오지 못하고 array와 비슷하게 불러오게된다.
coworkers.keeper="mysql"; //정보를 더넣을 때 쓰인다.
document.write("keeper : "+coworkers.keeper+"<br>"); //
coworkers["my day"]="global"; //위에서 말했듯이 띄어쓰기 할떄 괄호를 넣는다.
document.write("my day :"+coworkers["my day"]+"<br>");
</script>
-객체와 반복문 : 객체내부에서 모든 데이터를 뽑아내야 할때 위와 같이 쓰면 매우 비생산적이다.
반복문을 통해서 데이터를 꺼내자
<h2>iterate</h2>
<script>
for(var key in coworkers){ //coworkers 라는 객체내에서 key 값을 가져온다는 반복문이다.
document.write(key+'<br>'); //객체로 반복문을 만들고 싶을때 구문이다.
}
</script>
<br>
<script>
for(var key in coworkers){
document.write(coworkers[key]+'<br>'); //객체의 키값에해당하는 데이터를 가져오겠다는구문이다.
}
</script>
<br>
<script>
for(var key in coworkers){
document.write(key + ':' +coworkers[key]+'<br>') // 이렇게 하면 반복문을 하기전에 했던 구문과 같아진다.
}
</script>
위와 같이 처음에 했던 객체의 예문을 단 세줄로 줄일수가 있다.
-Property & Method
property : 위에서 설명했지만 한번더 하자면 객체 내부에 들어가는 속성값을 말한다.
var coworkers={"warrior":"changmin"}
{key값 : value값} // 내부에 들어가는 'warrior:changmin' 이 한덩어리를 property (속성값)이라고한다.
Method : 객체 내부에 들어가는 함수를 메소드라고한다. -
검색해보니,
Object.keys(객체명).length;
라고 나오네요.
"자바스크립트 객체 사이즈(크기)"나 "javascript object size"로 검색해보시면 더 알아보실 수 있을 것 같아요. -
배열에는 배열명[0]부터 내용물이 순서대로 인덱스가 매겨지는데,
객체에는 객체명[키값]에 따라 내용물에 접근할 수 있는 부분을 말씀하신 것 같아요!
예)
배열의 경우:
var arrayName = ['a', 'b', 'c', 'd'];
// 여기서 내용물은 왼쪽부터 순서대로 a[0], a[1], a[2], a[3] => 순서있는 인덱스마다 값이 정해져 있음
객체의 경우:
var objectName = { "name":"happy", "number": 3, "id":777 };
// objectName[name], object[number], object[id] => 순서없이 키(key)에 따라 값(value) 정해져 있음
구글에서 "자바스크립트 객체 배열" 등의 키워드로 검색해보시면 여러 자료가 있을거에요.
방금 하나 찾은 곳이 있어 링크 남겨드려봅니다.
https://www.zerocho.com......ee3 -
index: 배열 안의 데이터는 순서대로 배치되어 있음.
key: 객체에 속한 데이터는 순서대로 정리되어 있지 않음.
어떤 비유로 적용해야 할지는 아직 모르겠네요.
단순하게 딸기랑 바나나라는 데이터가 있을때 빨간색 과일은 딸기 노랑색 과일은 바나나는 배열이라고 말할 수는 없겠고.
또 과일주스는 딸기랑 바나나가 모두 속한다라고 해석하는건 오류가 있는거 같고.
아무래도 얼마나 단순한지 아니면 얼마나 복잡한지에 따라 배열과 객체로 나눈다라는 말이 납득할 수 있을거 같네요.
또는 얼마나 구체적인지 아니면 복잡해서 오히려 핵심만 집어야 나을거 같은 추상적인지에 따라 나눠질 수 있을거 같기도 하고요.
정확하다고는 말할 수는 없겠지만 제가 생각하기에
단순하다는 건, 이것이 채소인지 아니면 과일인지.
복잡한건 기차역에서 무엇을 하기에 이 사람은 손님이라고 불리는 것인가, 또 이사람은 (what,why,how,when,where) 하기에 역무원이라고 불리는 것인가? -
카렌 에델 웅 1강 까지 완료
-
감사합니다.
-
감사합니다. 열심히 듣고 있습니다.
이번 강의는 조금 어렵네요. -
감사합니다!!
20180831 -
다소 어렵지만, 쉽게 이해시켜주는 훌륭한 강의입니다. 어디에 어떻게 사용하게 될진 아직 정해진 바가 없지만 하루하루 일신우일신 하고 있습니다. 덕분에 감사합니다.
-
ㅋㅋ 어려워요 ^^ 그래도 고고^^
-
공부하시는분들 참조하세요~
===================
JavaScript의 this는 기존 언어에서 사용하던 this와는 다릅니다. 비슷한 의미로 사용될 때도 있지만, JavaScript의 this는 여러 가지 함수가 호출되는 방식(호출 패턴)에 따라 참조(바인딩)하는 객체가 다르기 때문입니다.
자바에서의 this는 인스턴스 자신을 가리키는 참조변수입니다. this가 객체 자신에 대한 참조 값을 가지고 있다는 것입니다. 주로 매개변수와 객체 자신이 가지고 있는 변수의 이름이 같을 경우 이를 구분하기 위해서 사용됩니다.
javascript의 this가 해당 함수 호출 패턴에 따라 어떻게 객체를 참조(바인딩)하는지에 대한 규칙
1. 기본적으로 this는 전역 객체를 참조한다.
2. 메소드 내부의 this는 해당 메소드를 호출한 부모 객체를 참조한다.
3. 생성자 함수 코드 내부의 this는 새로 생성된 객체를 참조한다.
4. call()과 apply() 메소드로 함수를 호출할 때, 함수의 this는 첫 번째 인자로 넘겨받은 객체를 참조한다.
5. 프로토타입 객체 메소드 내부의 this도 해당 메소드를 호출한 부모 객체를 참조한다.
6. JavaScript의 this 키워드는 접근제어자 public 역할을 한다.
JavaScript에서는 내부 함수 호출 패턴을 정의해 놓지 않기 때문입니다. 내부 함수도 결국 함수이므로 이를 호출할 때는 함수 호출로 취급되어 함수 호출 패턴 규칙에 따라 내부 함수의 this는 전역 객체를 참조하게 됩니다.
출처: http://k9e4h.tistory.com/141 [Kim's :D]
====================== -
property : 객체에 속한 변수
method : 객체에 속한 함수 -
파이썬에서의 함수는 일급 객체이기 때문에 딕셔너리의 value에 들어갈 수 있습니다.
-
nomadlife 말씀처럼 파이썬의 사전형(dict)과 비슷하네요.
다만 파이썬의 dict는 말 그대로 자료형(데이터)만을 담는 그릇이고 JS처럼 함수를 담을 수는 없습니다. 말하자면 객체를 다루기 위해 별도로 클래스라는 개념을 생성, 분리해놨다... 고 해야 하는 반면, JS는 별도의 클래스 개념은 없는 듯 보이네요. 자료형과 함수의 동거라니 @_@ -
감사합니다!
-
객체에 함수를 만드는 과정이 조금 이해가 어렵네요.
-
어디에 써먹는 것들인고!!! 저도 동감입니다ㅜ
"+ +" 따옴표 안에 플러스가 왜 들어가야하는지 모르겠지만
객체를 불러들이는 방법(?)을 여러가지 보여주신거같은데,
이해가 되고있는지 의심스러움을 안고 다음 강의로 고고~!! -
대체 이런것들을 어디에 써먹을지 궁금하군요
-
강의 잘 들었습니다. 항상 잘 보고 있습니다. 감사합니다.
-
너무 어렵네
-
객체 쓰기와 읽기 완료! 퇴근전 짬내서 듣고갑니다 : )
-
감사합니다~~~~~~~~~~~~~
-
벌써 여기까지 달렸네요.
감사합니다! -
function nightDayHandler(self){
var target = document.querySelector('body');
if(self.value === 'night'){
target.style.backgroundColor = 'black';
target.style.color = 'white';
self.value = 'day';
var alist = document.querySelectorAll('a');
var i = 0;
while(i < alist.length){
alist[i].style.color = 'powderblue';
i = i + 1;
}
} else {
target.style.backgroundColor = 'white';
target.style.color = 'black';
self.value = 'night';
var alist = document.querySelectorAll('a');
var i = 0;
while(i < alist.length){
alist[i].style.color = 'blue';
i = i + 1;
}
}
} -
function nightDayHandler(self){
var target = document.querySelector('body');
if(self.value === 'night'){
target.style.backgroundColor = 'black';
target.style.color = 'white';
self.value = 'day';
var alist = document.querySelectorAll('a');
var i = 0;
while(i < alist.length){
alist[i].style.color = 'powderblue';
i = i + 1;
}
} else {
target.style.backgroundColor = 'white';
target.style.color = 'black';
self.value = 'night';
var alist = document.querySelectorAll('a');
var i = 0;
while(i < alist.length){
alist[i].style.color = 'blue';
i = i + 1;
}
}
} -
체력이없어
-
이고잉억개
-
1억개쓰다가체력이없어서죽을것같은데.....
-
김예찬 배재영
-
객체에는 length가 없는 듯한데... for 반복문에서 i를 뭐보다 작다고 해야 하는지 뭐라고 구글링 해야 하나요?.. -
아리송 하지만 계속 고합니다! -
마음이 편하지 않네요ㅜㅜ
-
감사합니다..
버전 관리
| egoing |
| 현재 버전 | |
|---|---|
| 선택 버전 |
