Javascript/Vanilla JS

javascript ==, ===, querySelector(), querySelectorAll()

Vagins 2022. 1. 10. 15:44

22.01.10

오늘은 동계인턴 중인 회사에서 글을 써봅니다.

 

 

 

 

1. ==과 ===

 

js에는 두 변수나 객체를 비교할 때, ==과 ===, 두가지 equal 연산자를 사용합니다. 그 둘의 차이점에 대해 알아야합니다.

== 의 경우 

    두 값이 유형이 다르더라도 유형을 바꿔 값에 대한 비교만을 하는 연산자입니다.

=== 의 경우

    두 값의 유형과 값 모두 같을 때 true를 반환합니다.

 

EX)

null == undefined (true)

null === undefined (false)

var a = 1;

var b = “1”;

a == b (true)

a === b (false)

 

console.log(NaN == NaN); // false

console.log(NaN === NaN); // false

var a = [1,2,3];

var b = [1,2,3];

console.log(a == b); // false

console.log(a === b); // false

 

 

 

2. querySelector()와 querySelectorAll()

 

querySelector()

파라미터로 css 셀렉터가 와야합니다.

제공한 선택자 또는 선택자 뭉치와 일치하는 문서 내 첫 번째 Element를 반환합니다.

일치하는 요소가 없으면 null을 반환합니다.

동일한 클래스 명을 가진 객체가 있을 경우 html 문서내의 첫 번째를 나타내는 요소를 반환합니다.

결과가 없다면 null을 반환합니다.

예외는 파라미터 구문이 유효하지 않을 때 밖에 없습니다.

 

 

querySelectorAll()

파라미터로 css 셀렉터가 와야합니다.

반환 값은 일치하는 하나의 element를 포함하는 nodelist를 반환합니다.

일치하는 것이 없는 경우엔 빈 nodeList를 반환합니다.

예외는 파라미터 구문이 유효하지 않을 때 밖에 없습니다.