8 기본 내장 객체.

Presentation on theme: "8 기본 내장 객체."— Presentation transcript:

1 8 기본 내장 객체

2 8. 기본 내장 객체 기본 내장 객체 자바스크립트에는 이미 많은 객체가 내장
w3schools( 기본 내장 객체의 속성과 메서드에 관한 설명 및 예제 제공

3 8. 기본 내장 객체 기본 내장 객체 devdocs.io(http://devdocs.io/javascript/)
각각의 속성, 메서드와 관련된 자세한 정보

4 8.1 기본 자료형과 객체의 차이점 기본 자료형 숫자, 문자열, 불 세 가지 자료형을 의미
코드 8-1 : 기본 자료형과 객체의 자료형과 값을 출력 변수 primitiveNumber는 기본 자료형 숫자 변수 objectNumber는 생성자 함수를 사용하므로 객체

5 8.1 기본 자료형과 객체의 차이점 기본 자료형과 객체의 메서드
기본 자료형의 속성 및 메서드 사용  기본 자료형이 자동으로 객체 변환

6 8.1 기본 자료형과 객체의 차이점 기본 자료형과 객체의 메서드 기본 자료형에 메서드 추가

7 8.1 기본 자료형과 객체의 차이점 기본 자료형과 객체의 메서드 생성자 함수에 메서드 추가

8 8.1 기본 자료형과 객체의 차이점 기본 자료형과 객체의 메서드 프로토타입을 사용한 기본 자료형의 메서드 추가

9 8.2 Object 객체 생성 Object 객체는 자바스크립트의 최상위 객체 두 가지 방법으로 Object 객체 생성
일곱 가지 메서드

10 8.2 Object 객체 속성과 메서드 Object 객체의 메서드

11 8.2 Object 객체 속성과 메서드 hasOwnProperty( ) 메서드와 propertyIsEnumerable( ) 메서드

12 8.2 Object 객체 속성과 메서드 hasOwnProperty( ) 메서드와 propertyIsEnumerable( ) 메서드 property 속성을 검사한 것은 모두 true를 출력하고 constructor 속성 을 검사한 것은 모두 false를 출력

13 8.2 Object 객체 속성과 메서드 toString( ) 메서드 객체를 문자열로 변환하는 메서드

14 8.2 Object 객체 속성과 메서드 toString( ) 메서드 재선언

15 8.2 Object 객체 자료형 구분 Object 객체의 constructor ( ) 메서드는 객체의 생성자 함수를 의미
자료형을 검사할 때는 typeof 연산자 사용

16 8.2 Object 객체 자료형 구분 자료형을 검사할 때는 typeof 연산자 사용
두 변수 모두 숫자지만 생성자 함수로 만든 숫자는 객체

17 8.2 Object 객체 자료형 구분 typeof 연산자를 사용한 자료형 비교

18 8.2 Object 객체 자료형 구분 constructor ( ) 메서드로 자료형 비교

19 8.2 Object 객체 모든 객체에 메서드 추가 Object 객체의 프로토타입에 속성, 메서드 추가 시 모든 객체에 활용 가능

20 8.3 Number 객체 Number 객체 가장 단순한 객체로 숫자를 표현할 때 사용 Number 객체 생성

21 8.3 Number 객체 메서드 Object 객체가 갖는 일곱 가지 메서드 + 세 가지 메서드 추가

22 8.3 Number 객체 생성자 함수의 속성

23 8.3 Number 객체 생성자 함수의 속성

24 8.3 Number 객체 생성자 함수의 속성 Number 객체의 MAX_VALUE 속성
최대 숫자에 1을 더했음에도 오류 없이 출력

25 8.3 Number 객체 생성자 함수의 속성 Number.MAX_VALUE에서 Infinity로 변환

26 8.4 String 객체 String 객체 자바스크립트에서 가장 많이 사용하는 내장 객체 생성 두 가지 방법으로 생성

27 8.4 String 객체 기본 속성과 메서드 String 객체는 length 속성을 갖음

28 8.4 String 객체 기본 속성과 메서드 String 객체의 메서드는 기본 메서드와 HTML 관련 메서드로 구분

29 8.4 String 객체 기본 속성과 메서드 잘못된 String 객체의 메서드 사용

30 8.4 String 객체 기본 속성과 메서드 올바른 String 객체의 메서드 사용

31 8.4 String 객체 기본 속성과 메서드 HTML 관련 메서드

32 8.5 Array 객체 Array 객체 여러가지 자료를 쉽게 관리할 수 있게 도와주는 객체 생성 Array 생성자 함수

33 8.5 Array 객체 속성과 메서드 배열은 몇 개의 요소가 있는지 나타내는 length 속성이 있음

34 8.5 Array 객체 속성과 메서드 Arry 객체의 메서드

35 8.5 Array 객체 속성과 메서드 sort( ) 메서드 사용

36 8.5 Array 객체 정렬 sort( ) 메서드의 정렬에 변화를 주고 싶을 때  sort( ) 메서드의 매개변수로 함수를 넣어 줌 sort( ) 메서드의 매개변수로 들어가는 함수는 기본적으로 매개 변수 두 개를 받을 수 있어야 함

37 8.5 Array 객체 정렬 sort( ) 메서드의 정렬 방식 지정

38 8.5 Array 객체 정렬 예제 : 학생 성적 정렬

39 8.5 Array 객체 정렬 slice( ) 메서드 sort( ) 메서드의 매개변수로 총점을 내림차순 정렬
0번째 인덱스부터 변수 students에 할당

40 8.5 Array 객체 정렬 Array 객체 메서드의 체이닝

41 8.5 Array 객체 요소 제거 Array 객체의 메서드는 특정 요소를 제거하는 메서드가 없음
splice( ) 메서드로 특정 요소를 제거하는 기능을 쉽게 만들 수 있음

42 8.5 Array 객체 요소 제거 Array 객체의 메서드는 특정 요소를 제거하는 메서드가 없음
splice( ) 메서드로 특정 요소를 제거하는 기능을 쉽게 만들 수 있음

43 8.6 Date 객체 Date 객체 생성 날짜와 시간을 표시하는 객체
생성자 함수에 어떤 매개변수도 입력하지 않으면 현재 시간으로 초기 화

44 8.6 Date 객체 생성 문자열을 사용한 Data 객체 생성 숫자를 사용한 Data 객체 생성

45 8.6 Date 객체 메서드 get 형태의 메서드 : 게터 set 형태의 메서드 : 세터

46 8.6 Date 객체 메서드 to○○String ( ) 형태의 메서드

47 8.6 Date 객체 시간 간격 계산 날짜 간격 : getTime( ) 함수 사용

48 8.7 Math 객체 Math 객체 Math 객체는 변수

49 8.7 Math 객체 Math 객체 Math 객체의 속성

50 8.7 Math 객체 Math 객체 Math 객체의 메서드

51 8.8 ECMAScript 5 Array 객체 ECMAScript 5 HTML5와 함께 출현한 자바스크립트 표준안 확인 메서드

52 8.8 ECMAScript 5 Array 객체 탐색 메서드 ECMAScript 5에서 Array 객체는 추가로 메서드를 갖음

53 8.8 ECMAScript 5 Array 객체 반복 메서드 map( ) 메서드
배열의 각 요소를 변경해 새로운 배열을 리턴하는 메서드

54 8.8 ECMAScript 5 Array 객체 조건 메서드 filter( ) 메서드

55 8.8 ECMAScript 5 Array 객체 연산 메서드 reduce( ) 메서드

56 8.8 ECMAScript 5 Array 객체 reduce( ) 메서드 reduceRight( ) 메서드
그림 8-36과 같은 형태로 배열읭 요소를 함수의 매개변수로 전달 처음에는 배열의 요소 다섯 개에서 두 개를 검사 후 하나로 합침 하나로 합친 값을 다음 요소와 비교해 또 하나로 함 배열의 요소를 하나가 될 때까지 줄임 reduceRight( ) 메서드

57 8.9 ECMAScript 5 JSON 객체 JSON ECMAScript 5부터는JSON 객체 지원
JSON(JavaScript Object Notation)은 자바스크립트 객체의 형태를 가지는 문자열을 뜻함

58 8.9 ECMAScript 5 JSON 객체 JSON ECMAScript 5부터는JSON 객체 지원
JSON(JavaScript Object Notation)은 자바스크립트 객체의 형태를 가지는 문자열을 뜻함

59 8.10 ECMAScript 5 String 객체 ECMAScript 5 String 객체

60 8.11 ECMAScript 5 Object 객체 객체 속성 추가 ECMAScript 5에서 객체에 속성을 추가하는 메서드

61 8.11 ECMAScript 5 Object 객체 객체 속성 추가 ECMAScript 5의 객체 속성 관련 옵션

62 8.11 ECMAScript 5 Object 객체 객체 속성 추가
value 옵션, writable 옵션, enumerable 옵션

63 8.11 ECMAScript 5 Object 객체 객체 속성 추가 get 옵션과 set 옵션

64 8.11 ECMAScript 5 Object 객체 객체 속성 추가 configurable 옵션

65 8.11 ECMAScript 5 Object 객체 객체 속성 추가 Object.defineProperties( ) 메서드
defineProperty ( ) 메서드는 한 번에 하나의 속성만 지정할 수 있음 defineProperties ( ) 메서드는 한꺼번에 여러 개의 속성을 지정할 수 있음

66 8.11 ECMAScript 5 Object 객체 객체 생성
ECMAScript 5에서 객체를 생성할 때 : create ( ) 메서드 사용

67 8.11 ECMAScript 5 Object 객체 동적 속성 추가 제한
자바 스크립트의 모든 객체는 동적으로 속성 똔느 메서드를 추가하거 나 삭제할수 있음 ECMAScript 5부터는 이렇게 동적으로 속성을 추가하는 것을 제한하는 기능이 생김

68 8.11 ECMAScript 5 Object 객체 동적 속성 삭제 제한

69 8.11 ECMAScript 5 Object 객체 동적 속성 삭제 제한

70 8.11 ECMAScript 5 Object 객체 객체 보조 메서드 ECMAScript 5의 객체는 보조 메서드를 제공
keys ( ) 메서드와 getOwnPropertyNames ( ) 메서드는 비슷 keys ( ) 메서드와 getOwnPropertyNames ( ) 메서드의 차이점 keys ( ) 메서드는 enumerable 옵션이 true인 속성만 배열로 만듬 getOwnpropertyNames ( ) 메서드는 그것에 상관없이 현재 객체가 스스로 지닌 모든 속성을 배열로 만듬

71