Front-end(170)
-
[객체] 2. HTML DOM 객체 - 1) 개요
HTML DOM의 개념 브라우저는 HTML 페이지를 로드하는 과정에서 각 HTML 태그를 하나의 객체로 만듬 예를 들면, ... 로 구성된 요소는 p 객체로, ..로 구성된 요소는 div 객체로 생성함 이들은 HTML 문서의 각 요소를 객체화한 것이라는 뜻으로 HTML DOM(Document Object Model) 객체라고 부름 HTML을 동적으로 제어하기 위해서는 HTML DOM에 대한 지식이 반드시 필요 각 HTML 태그에는 모양을 결정하는 CSS3 스타일 시트가 동반되므로, DOM 객체를 통해 CSS3 스타일의 프로퍼티 값을 바꾸면 HTML 태그가 출력된 색이나 모양을 동적으로 제어할 수 있다. DOM 객체를 통해 HTML 태그의 콘텐츠, 즉 텍스트나 이미지도 변경 가능 DOM 트리의 특징 - D..
2021.01.18 -
[객체]사용자 객체 만들기
- 개발자는 Array, String, Date 등 자바스크립트에서 제공하는 코어 객체 외 새로운 타입의 객체를 만들어 사용할 수 있음 - 프로토타입(prototype) : 개발자가 선언하는 새로운 객체 타입을 프로토타입 이라고 함 → 나중에 더 학습해보기 - 프로토타입 없이 간단히 사용자 객체를 만드는 방법 1) new Object()로 객체 만들기 var account = new Object(); account.owner = "냥인"; account.code = "1111"; account.balance = 35000; //account 라는 새로운 객체를 만들고 owner,code,balance 라는 각각의 프로퍼티를 추가하는 코드 2) 리터럴 표기법으로 객체 만들기 var account = { o..
2021.01.18 -
[객체] 1. 코어 객체 - 4) Math
Math 객체는 new Math()로 객체를 생성하지 않고 Math.프로퍼티 또는 Math.메소드()와 같이 사용한다. 주요 메소드 abs(x) : x의 절대값 리턴 sin(x) : 싸인 x 값 리턴 random(): 0~1보다 작은 임의의 실수 리턴 floor(x): x보다 작거나 같은 수 중 가장 큰 정수 리턴 , 예)Math.floor(3.2) = 3 round(x) : x를 반올림한 정수 리턴. 예) Math.round(3.7) = 4, Math.round(2.2) = 2 sqrt(x) : x의 제곱근 리턴 주요 프로퍼티 E : Euler 상수 PI : 원주율, 3.141592 ....
2021.01.18 -
[객체] 1. 코어 객체 - 3) String
String : 문자열을 객체로 만들어 문자열을 다루기 쉽도록 해주며 많은 메소드를 제공한다. String 객체 String 객체는 new String()을 이용하여 생성하기도 하지만 문자열 리터럴은 자동으로 String 객체가 된다. var hello = new String("Hello"); var hello2 = "Hello"; // 두 가지 모두 String 객체 생성하는 방법이다. String 객체는 수정 불가 String 객체는 일단 생성되면 내부의 문자열 수정이 불가능하다. 다음 코드는 hello.concat()이 실행되어도 원본 hello 객체의 문자열은 변하지 않음을 보여준다. var hello = new String("hello"); var res = hello.concat("JavaSc..
2021.01.18 -
[객체] 1. 코어 객체 - 2) Date
Date 객체란 ? : 시간 정보를 담는 객체 var now = new Date(); // 현재 날짜와 시간(시,분,초) 값으로 초기화된 객체 생성 Date 객체 생성 방법 new Date() : 현재 날짜와 시간 값으로 초기화된 객체 생성 new Date(y,m,d) : y(년), m(월, 0~11) , d(일, 1~31)을 나타내며, 이 시간 정보를 가진 객체 생성 new Date(y,m,d,hour,min,sec): 년,월,일,시,분,초 를 나타내며, 이 시간 정보를 가진 객체 생성 var specialDay = new Date(1997,0,1) // 1997년 1월 1일의 시간 정보를 담는 객체 생성 Date 객체의 주요 메소드 : Date 객체는 객체 속에 들어 있는 시간이나 날짜 정보를 리턴하..
2021.01.18 -
[객체] 1. 코어 객체 - 1) 배열
코어 객체의 종류 : Array, Date, String, Math 코어 객체의 생성 예) const today = new Date(); 예) const msg = new String("Hello"); 이 때 today, msg는 생성된 객체를 가리키는 레퍼런스 변수 Array (배열) 배열: 여러 개의 원소들을 연속적으로 저장하고 전체를 하나의 단위로 다루는 데이터 구조 var n = [4, 5, -2, 28, 33]; var cities = ["Seoul","Tokyo","Newyork","Sapporo","Fukuoka"]; 배열의 각 원소에 접근하는 방법 : 배열이름[index] plots[10] = 33; // 오류 2. Array 객체로 배열 만들기 1) 초기 값을 가진 배열 생성 var we..
2021.01.18