자바스크립트는 자바와 달리 설계를 가지고 객체를 생성하는 것이 아니라, 기본 객체를 만든 다음에 프로퍼티(변수와 함수)를 추가하는 것이다. 그래서 기본 객체를 바탕(prototype;원형객체)으로 만든다고 해서 “프로토타이핑(prototyping) 방식의 객체 생성”이라 부른다.
자바스크립트에서는 함수가 객체 안에 들어있다. 자바에서는 클래스에 들어있다!
자바스크립트에서는 {}는 배열이 아니라 객체생성하는 코드이다!
객체의 멤버로서 함수를 추가할 때는 arrow funtion을 사용하는것이 좋지 않다.
arrow fuction을 객체의 프로퍼티로 등록할 때,
// => arrow function은 기본적으로 글로벌 함수에 소속된다.
// 따라서 this가 가리키는 것은 window 객체이다.
// => 그에 비해 일반 함수나 익명 함수에서 사용하는 this는 자신이 소속된 객체를 가리킨다.
//
css selector문법으로 찾기
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ex05</title>
</head>
<body>
<h1>DOM API - CSS selector 문법으로 태그 찾기</h1>
<h1 id="header1" class="g1">제목1</h1>
<h2 id="header2" class="g1">제목1.1</h2>
<h2 id="header3" class="g1 g3">제목1.2</h2>
<h1 id="header4" class="g2">제목2</h1>
<h2 id="header5" class="g2 g3 g1">제목2.1</h2>
<h2 id="header6" class="g2 g3">제목2.2</h2>
<script>
"use strict"
// querySelector("CSS selector 문법")
// => Element 객체 리턴
// => 만약 여러 개를 찾았다 할 지라도 그 중 첫 번째 것만 리턴한다.
//
// 1) 아이디로 찾기
var e = document.querySelector("#header3");
console.log(e);
console.log("---------------------");
// 2) 태그 이름으로 찾기
// => 조건에 해당하는 태그가 여러 개일지라도 그 중 첫 번째 것만 리터한다.
e = document.querySelector("h2");
console.log(e);
console.log("---------------------");
//3) 분류명으로 찾기
//=> 조건에 해당하는 태그가 여러 개일지라도 그 중 첫 번째 것만 리터한다.
e = document.querySelector(".g2");
console.log(e);
console.log("---------------------");
//4) CSS selector 문법을 사용하기 때문에 복잡한 조건을 기술할 수 있다.
//=> 조건에 해당하는 태그가 여러 개일지라도 그 중 첫 번째 것만 리터한다.
e = document.querySelector(".g2.g3");
console.log(e);
console.log("---------------------");
//5) 조건에 해당하는 태그를 찾지 못했다면?
// => 리턴 값은 null이다.
e = document.querySelector(".g2.g3.g1");
console.log(e);
</script>
</body>
</html>
핸들바스
제이쿼리에서 $의 의미는
함수 객체의 주소를 갖고 있는 변수다