[jQuery] jquery와 javascript의 차이점

우리는 jquery를 이용해 js dom을 아주 쉽게 사용할 수 있다.

 

$(document).ready(function(){


});

위의 코드를 분석해보자

 

$은 jquery keyword로써 모든 jquery문들은 $로 시작한다.

 

$다음에 parenthesis가 온다. 그리고 이 괄호안에 우리가 select할 것을 두면된다.

여기서 우리는 document(전체 HTML)을 선택했다.

 

우리는 이제 jquery안에있는 내장 메소드를 사용해 document가 ready가 되면 안에있는 콜백함수 실행된다.

 

 

이제 jquery와 vanilla javascript의 차이점을 알아보자.

 

이 코드를 확인해보자.

 

첫번째 코드는 getElementById를 사용해 logo를 선택한다.

두번째 코드는 jquery를 사용해 logo를 선택한다.

 

vanilla javascript를 이용한 코드는 select한 element를 리턴한다

jquery를 이용한 코드는 select한 element를 array에 담아서 리턴한다.

 

그러니까 우리가 jquery 를 이용해 element를 select할때, jquery는 select한 element들을 jquery array object로 리턴한다. 그렇게 select한 element들은 jquery의 메소드들을 사용할 수 있다.

 

더 자세히 말하면, jquery엔 init 이라는 생성자가 있다. 그 생성자가 select된 element들을 파라미터로 받아 array에 담고 return 한다. 그렇게 array는 init함수의 인스턴스 되므로 init함수의 프로토타입 객체에 있는 메소드들을 사용할수있다. 

 

element들은 init이 생성한 array에 담겨있기에 init.prototype의 메소드에 접근할 수 있는것이다. 그렇기에 우리가 array를 unwrap (예) logo[0])을 하면 더이상 jQuery메소드들을 사용할 수 없다.