javascript 기초개념 01_객체_object

변수
 - 일반적으로는 속성[string, 문자열] 집어넣는데. 사실 객체, 함수, 속성, 메소드 등 모두 다 넣을 수 있다. 
 - 속성과 속성값으로 되어있다.
 - 동작을 지정하는게 아님 

예)
var misun = "misun misun";
console.log(misun);

var jie = 121212  숫자는 따옴표 X
var jie = 'abcd'  문자열
var jie = 'A'

함수

function jie_eat () {
   alert('먹었다');   함수
};

함수의 선언 vs 변수의 선언 차이
- 함수 : 앞에 function () 가 붙는다.
- 변수 : 앞에 var 가 붙는다. : 뭐는 뭐다 1대1 대입

객체
: 함수와 변수 때거지를 집어넣을수 있는 하나의 개념
: property(객체속에 있는 속성)와 methody(객체속에 있는 합수), 또다른 객체 를 다 묶을수 있는 덩어리

객체 속에 변수만 있다 = 객체 O
객체 속에 함수만 있다 = 객체 O
객체속에 또다른 객체만 있다 = 객체 O

그러나 통상적으로 javascript 에서는 지칭할때
객체속에 변수만 있다 = 통상적으로 변수라고 부를 수 있다
객체속에 함수만 있다 = 함수라고 부를 수 있다
객체속에 객체만 있다 = 객체라고 부를 수 있다

javascript 에서는 변수도 객체다.
왜냐하면 변수의 타입이 정해저 있기 않기 때문에 변수에 모든것을 (변수, 함수, 숫자, 문자 등) 넣을 수 있다.

var jie = [example]
: example 속에 변수도, 객체도, 함수도 다 넣을 수 있다.

어렵다고 생각이 들면,
javascript 는 그냥 다 객체라고 생각해  -최과장님-

객체의 특징 
- 객체는 또다른 객체를 이어받을수 있다. : 상속
http://sexybone.tistory.com/193

소속
: 객체가 어디에 속해있는지 아는것이 중요.

브라우저 내장 객체 
 - 속성, 함수 값이 자체적으로 만들어져 있다. 
 - 브라우저에서만 쓰는것. 부라우저가 있어야만 쓸수 있다.
   (예 : window, document.. 등등)

--> 이 소속을 알아 내기 위하여, http://sexybone.tistory.com/193
: colsole.log(example); 은 3개 브라우저에서 다 있는 객체
: colsole.trace : trace 함수는 firefox와 chrome 은 지원하나, ie에서는 지원하지 않는다.

!! ie 객체가 trace method 를 지원하지 않습니다. 
* 주의점 : javascript 는 하나가 오류나면 다른것도 같이 로딩이 안되기 때문에 항상 유의하여야 함.

* trace : 클릭하면 일어나는 과정을 추적하여 보여줌. (firebug에서 실행)
[이미지 삽입 예정]

문제점 : 브라우저 마다 다른 js 객체
그 이유는 각 브라우저마자 기본적으로 내장되어있는 script가 설정이 되있기도하고 아니기도 하고 막 중구난방임.
옛날에는 개발자가 함수를 직접 만들었다.
jquery 가 나오면서 if chrome 이면 어케하고, if 파폭이면 어케하고, else 익스면 이래이래....
이런걸로 통일해줌. 소스도 짧고 간결하게 해줌

예시 :
// 변수를 선언합니다.
var header = document.createElement('h1');
var textNode = document.createTextNode('Hello DOM');

// 노드를 연결합니다.
header.appendChild(textNode);
document.body.appendChild(header);

--> $('body').appendChild(.......

웹표준 : 웹표준이라고 하면 보통 html과 css만 맞추면 된다고 생각하는데, 브라우저에 내장되어있는 javascript 객체도 맞춰주는것이 웹표준의 완성이다.  

javascript 내장객체 표준 에 window, document 반드시 필요
http://sexybone.tistory.com/191


객체 만들기

var jie = {  객체선언 문법
  jieName : '이지혜';  1대1 대입 ; 객체속 변수는 property라고 한다
  jieEat : function() { 객체속 함수 넣기 ; 객체속 함수는 method라고 한다
             alert('abcde');
}

 

javascript 공부방법
1. javascript를 할때 하나하나 단어가 먼지 먼저 염두해 둬야 .
2. 생각체계를 바꿔야 한다.
3. 하나하나 따지면서 해야함. 조금느리지만,
4. 객체이름들이 나올때 그냥 외우지말고 뭔지 궁금해 해야함
--> 모든 프로그래밍 언어에서 기초가 되는 방식,
문법이나 쓰여지는 패턴을 파악하게 되면 다른 언어들도 쉽게 알수가 있다.
그냥 무작정 외우게되면 외우기도 어려울뿐더라 나중에 꺼내고 응용하기도 어렵다.
5. 기본개념을 먼저 익힌후 예외사항을 공부한다.

javascript를 볼때
1. 객체인지, 함수인지, 속성인지, 객체속객체인지, 객체가 뭉쳐있는건지, 함수속성객체가 뭉쳐있는 객체인지 확인
--> 아는 방법은 : firebug에서 consol.log를 통해 찍어보면 확인할수있다.
2. 구조 : 속한곳이 어디인지 확인 (브라우저내장객체? 문서객체? 자바스크립트 기본객체?..)
http://sexybone.tistory.com/193

도움말

: 내가 쓰는 texteditor에서는 이 객체가 먼지 알고싶으면 해당 객체를 선택지정한 후 h1 누르면 도움말이 나온다.

http://msdn.microsoft.com/query/dev10.query?appId=Dev10IDEF1&l=EN-US&k=k%28DOCUMENT%29;k%28VS.HTMLDESIGNER.HTML%29;k%28DevLang-JAVASCRIPT%29&rd=true

관련 링크
-> javascript 기초개념 02_firefox를 통해서 객체속성 추적하기
-> javascript 기초개념 03_소스 판독하기