자바스크립트 객체
프로퍼티: 객체의 고유한 속성
객체는 여러 프로퍼티와 값의 쌍
메소드: 객체 내 함수
객체는 소멸시키는 방법이 없다. >> 가비지 컬렉션: 사용하지 않는 객체 자동 수거
자바스크립트 객체의 종류
HTML DOM객체 >> CH8
html 페이지에 작성된 태그들을 브라우저가 하나씩 객체화한 것
html 페이지의 내용과 모양을 제어하기 위해 사용
브라우저 관련 객체(BOM) >> CH10
브라우저의 종류나 스크린의 크기정보 제공하는 등 브라우저 관련 객체들
코어객체
기본 객체
Array, Date, String, Math 타입 등
코어 객체 생성하기, new
var today = new Date();
var msg = new String("hello");
객체 접근
객체명.프로퍼티 = 값;
번수 = 객체명.프로퍼티;
객체명.메소드(매개변수값);
배열과 Array
배열 생성
1. [] 이용
var num = [1,2,3,4,5]
//원소 추가시 자동으로 늘어난다
num[6] = 6
r건너뛰고 원소 추가할 경우 그 사이의 값은 undefined가 됨
2. Array 객체 이용
var week = new Array(1,2,3,4,5);
//원소에 접근하기
var min = week[0]
//배열 객체 일단 생성하고 나중에 값 삽입하는 것도 가능
var week = new Array(7);
week[0] = 1;
// 원소 개수 예상할 수 없는 경우 빈 배열 생성도 가능
var week = new Array();
배열의 원소 개수 계산하기
배열이름.length;
배열 length는 사용자가 임의로 값 변경 가능
배열의 특징
Array 객체임
여러 타입의 데이터가 섞여서 저장될 수 있다.
Array객체의 메소드
concat(arr) | 현재 배열에 배열 arr의 원소들을 덧붙여 만든 새 배열 리턴. 현재 배열은 변하지 않음 |
join([separator]) | 배열의 모든 원소들을 연결해 하나의 문자열로 만들어서 리턴. 각 원소 사이 지정된 seperator 삽입. 생략시 "," |
reverse() | 원소 역순 재배열한 새로운 배열 리턴 |
slice(idxA,idxB) | 두 인덱스 idxA idxB 사이의 원소들로 구성된 새 배열 리턴. 단 idxB의 원소는 포함안됨 |
sort() | 문자열 사전순 정렬한 새 배열 리턴 |
toString() | 원소들 모두 연결하여 사이에 "," 삽입하고 하나의 문자열로 리턴 |
Date 객체
//현재 날짜와 시간(시,분,초)로 초기화된 객체 생성
var now = new Date();
//2017년 3월 1일 기억하기 위해 date 객체 생성
var day = new Date(2017, 2, 1);
date 객체에서 월 값은 0부터 시작함.
String 객체
문자열을 객체로 만들어 다루기 쉽게 해줌
문자열 리터럴은 자동으로 string 객체가 된다.
//두 코드는 동일
var hello = new String("hello");
var hello = "hello";
string 객체는 수정할 수 없다.
문자열의 길이 확인, length
[]를 이용해 배열처럼 문자열의 각 문자에 접근 가능
string메소드
indexOf(str): 문자열 검색해 str의 처음 시작 인덱스 리턴. 없으면 -1 리턴
서브스트링 리턴, slice, substr, substring
이중 substr(a,b)는 인덱스a 부터 b개의 문자로 구성된 문자열 리턴
문자열 변경, replace(a,b)
대소문자 변경, toUpperCase, toLowerCase
문자열 분할, split()
문자열 앞 뒤 공백 제거, trim()
특정 위치에 있는 문자열 알아내기, charAt()
Math 객체
수학적 계산 위함
new Math로 객체 생성하지 않고 Math.프로퍼티/메소드 형식으로 사용
random(): 0~1사이의 난수 생성
abs: 절대값
pow(x,y) x의 y승
floor(x): 내림
round(x): qksdhffla
sqrt(x), 제곱근
사용자 객체 만들기
프로토 타입 없이 간단하게 사용자 객체 만들기
//사용자 객체 생성
var account = new Object();
//객체 내 프로퍼티 생성
account.owner = "이름";
account.code = "111";
//프로퍼티 사용
var name = account["owner"];
account["code"] = 1000;
account.code += 100;
//메소드 만들기
function deposit(money){
this.code += money;}
account.deposit = deposit;
리터럴 표기법으로 {}내에 프로퍼티와 메소드를 한번에 만들 수도 있다.
var acount={
owner : "이름",
code : "111",
balance:35000,
inquiry : function() {return this.balance;},
deposit : function(money){this.balance += money;}
withdraw : function(money){
this.balance -= money;
return money;
}
};
'학교수업 > 웹 프로그래밍' 카테고리의 다른 글
9. 이벤트 기초 및 활용 (0) | 2022.06.08 |
---|---|
08. HTML DOM과 Document (0) | 2022.06.08 |
6. 자바스트립트 언어 (0) | 2022.06.08 |
5. CSS 고급활용 (0) | 2022.06.07 |
4. CSS (0) | 2022.06.06 |