본문 바로가기

Programming/JavaScript

(5)
DAY 93. JavaScript - DOM DOM(Document Object Model) HTML에 있는 태그를 객체화하여 자바스크립트에서 다룰 수 있게 한 것이다. 모든 노드(element) 객체에 접근할 수 있는 요소와 메소드를 제공한다. 기능 추가, 스타일 변경이 가능하다. 노드 HTML에 있는 태그를 구조화(트리) 하였을 때 각각의 태그를 노드라고 일컫는다. 요소 노드와 텍스트 노드 요소 노드(Element Node) : 태그 그 자체를 의미한다. 텍스트 노드(Text Node) : 태그에 기록되어 있는 문자이다. ** 텍스트 노드를 가지지 않는 요소 노드들과(ex. img), 가지는 노드가 있다. (h, p 등) 텍스트 노드가 있는 문서 객체를 작성 요소 노드와 텍스트 노드를 생성하고 이를 body 노드의 자식으로 포함이 가능하다. 요..
DAY 88. JavaScript - 객체, 내장 객체 객체 객체를 만들기 전에는 class를 먼저 만들고, new 연산자를 사용해서 객체를 만든다. 자바 스크립트는 프로토 타입 기반의 객체 지향 언어이다. 따라서 클래스 기반 언어와는 다르게 객체 생성 방법이 여러 개가 있는데 객체 리터럴을 사용하는 방법 : 변수에 객체 리터럴이 할당되는 순간에 변수의 타입이 정해진다. let 변수명 = {}; 속성 만들기 - 자바의 인스턴스 필드, 메소드와 같은 것들을 속성 = 프로퍼티라고 부른다. - 속성은 키와 값으로 구성이 된다. - 키(KEY)는 일반적으로 문자 데이터이지만 식별자를 지정하는 네이밍 규칙을 만족하면 '키 이름' 에 ' '를 생략할 수 있다. - 키를 숫자 형태로 지정할 수 있는데, 실제 저장될 때는 내부적으로는 문자로 변환되어 인식한다. - 값(VA..
DAY 87. JavaScript - 함수 함수 객체 타입의 값이다. 소스코드의 집합으로써 메소드, 모듈, 기능, 프로시저 등을 말한다. 자바스크립트에서는 function 자료형이다. 함수는 인자(입력되는 값)/매개변수(입력되는 값을 받는 변수), 리턴 값을 가질 수 있다. 코드 블록으로 만들어서 함수 자료형으로 만들어서 재사용, 코드 중복을 줄여 유지보수를 용이하도록 사용한다. ▪️ 함수 선언 반환 값 선언 없이 function 키워드만 사용한다. 선언적 함수 : function 키워드에 함수명을 작성하여 사용하는 방법 익명 함수 : function 함수명 작성하지 않고 변수에 대입하는 방법, 변수명을 통해서 함수 호출한다. ⇒ callback 형태 스스로 동작하는 함수 : 호출 없이 바로 사용 (function(){ 처리 로직 })(); //..
DAY 86. JavaScript - 배열 배열 배열은 문자 뿐만 아니라, 숫자, 객체, 함수 등도 포함할 수 있다. 다양한 타입의 데이터를 보관하는 변수 모음이자 객체이다. [ ] 를 통해 생성과 초기화를 동시에 처리가 가능하다. 자료형 지정이 없기 때문에 모든 자료형 데이터로 저장이 가능하다. ** 숫자, 문자열, 함수, Boolean, undefined, 객체 let 변수명 = [값1(숫자), 값2(숫자), 값3(객체), 함수 ...]; 값 입력시 index 번호 활용한다. 배열에 요소가 추가되면 .length 프로퍼티도 자동으로 갱신된다. 배열 선언 (Array Declaration) new 연산자와 Array 객체를 통해 배열을 선언한다. ▶️ 크기를 정하지 않은 배열의 선언 : var 변수명 = new Array(); ▶️ 크기를 정한..
DAY 85. JavaScript - 기본 개념, 변수, 자료형, 연산자 JavaScript 웹 브라우저에서 많이 사용하는 인터프리트 방식의 객체지향 프로그래밍 언어 ECMA(European Computer Manufacturers Association) 스크립트 표준을 따르는 대표적인 웹 기술이다. (EC5 버전으로 배울 것) 자바스크립트 작성 방식 inline 방식 html 태그의 on이벤트 속성을 이용하여 내장 메소드를 호출하거나 개발자가 선언한 사용자 정의 함수를 호출할 때 사요한다. 자바스크립트 양이 한 두 줄 정도로 소량일 때 사용한다. 태그에 이벤트 핸들러 속성을 이용하여 직접 실행 코드를 작성한다. internal 방식 가장 일반적인 방식 html 파일 내 나 안에 자바스크립트 소스 작성한다. 자바스크립트 코드 작성, 함수 단위로 소스코드를 작성하고 html 태..