JS 대상방향 (1) - 소개, 입문, 시스템 상용 클래스, 사용자 정의 클래스, constructor, typeof, instanceof, 대상의 메모리에서의 표현 형식

관련 링크:
JS 대상방향 (1) - 소개, 입문, 시스템 상용 클래스, 사용자 정의 클래스, constructor, typeof, instanceof, 대상의 메모리에서의 표현 형식
JS 개체 대상(2) - this의 사용, 개체 사이의 값, for...in문장, delete 사용, 구성원 방법, json 대상의 사용,prototype의 사용, 원형 계승과 원형 체인
JS 대상방향 (3)-Object 클래스, 정적 속성, 클로즈업, 사유 속성, 콜과 apply 사용, 계승의 세 가지 실현 방법
1. 발전사
기계를 향하다
프로세스로: 프로그램의 실행을 몇 단계로 분해합니다
대상을 향한: 프로그램의 실행을 몇 가지 사물로 분해합니다
 
2. 대상을 향한 두 기본 개념
클래스: 어떤 사물을 대표하며 추상적이다
대상: 어떤 사물을 대표하는 구체적
 
3. 빠른 시작
한 사람의 완전한 정보를 표현하다

 1 <script>
 2     
 3     // 
 4     var name = 'zhangsan';
 5     var age = 30;
 6     var marry = true;
 7     alert(name + age + marry);
 8     
 9     // 
10     function Person{
11     }
12     var p1 = new Person();
13     p1.name = 'lisi';
14     p1.age = 20;
15     p1.marry = true;
16     alert(p1.name + p1.age + p1.marry);
17     
18 </script>

과정에 대한 예에서 우리는 세 가지 변수를 사용하여 한 사람의 완전한 정보를 정의했다. 그러나 이 세 가지 변수는 그들 사이에 필연적인 관계가 없다. 예를 들어 나는 지금 변수age를 찾았다. 데이터를 찾을 수 있지만 이것이'누구'의 나이인지 잘 모르겠다.
객체 지향 예에서 function Person{}은 구조자입니다.모든 정의의functionPerson{}은 Person류의 구조 함수라는 것을 우리는 이렇게 이해할 수 있다.
 
4. JS에서 흔히 볼 수 있는 시스템 클래스
1) String 클래스 문자열 클래스
length: 문자열 길이 가져오기
indexOf(string): 문자열에 매개변수가 나타나는 위치를 가져옵니다.
substr(num1, [num2]): 문자열 캡처
toLowerCase():소문자로 변환
toUpperCase():대문자로 변환
replace(str1,str2):문자열 대체
2) Date 클래스 날짜 클래스
getYear (): 연도를 되돌려줍니다. (가끔 오류가 발생할 수 있습니다. 두 번째 것을 권장합니다.)
getFullYear():연도 반환
getMonth(): 월로 돌아가기(0---11)
getDate(): 매월 며칠째 반환
getDay(): 요일 반환(0-6)
getHours(): 반환 시간
getMinutes(): 분 반환
getSeconds(): 초 반환
getMilliseconds(): 밀리초 반환
3) Math 클래스 수학 클래스
ceil(수치): 이 수보다 크거나 같은 최소 정수(예를 들어 페이지 나누기 Math.ceil(4.8)=5)를 되돌려줍니다.
floor(수치): 이 수보다 작거나 같은 최대 정수를 되돌려줍니다
min(수치 1, 수치 2): 최소수점 반환
max (수치 1, 수치 2): 최대 수를 되돌려줍니다.
pow(수치 1, 수치 2): 수치 1의 수치 2차원을 되돌려줍니다
random(): 반환 랜덤 수 0------1
round(수치): 반올림
sqrt(수치): 평방근
Math 클래스의 방법은 모두 정적 방법입니다
 
5. 사용자 정의 클래스 - 클래스의 정의
구문:
function 클래스 이름()
}
js에서 클래스의 정의 문장은 없고,function만 있으며, 각각function만 있으면, 우리는 그것이 동명 클래스의 구조 함수라고 생각할 수 있다
예를 들면 다음과 같습니다.
function person(){
} 
Person 클래스의 구조 함수입니다.
이런 함수도 구조기라고 부른다
 
6. 사용자 정의 클래스 - 객체 선언
문법: var 대상 = new 클래스 이름 ();
키워드 new: 실례화 대상, 메모리 공간 개척

1 function Person(){
2     alert('hello');
3 }
4 var p1 = new Person();

위의 이 예를 실행하면, 우리는 실례화할 때, Person 구조 함수를 직접 실행한 것을 발견하였다
 
7. 사용자 정의 클래스 - 객체 속성 사용
구문:
대상속성
객체['속성'];

1 function Person(){
2     alert('hello');
3 }
4 var p1 = new Person();
5 p1.name='zhangsan';
6 p1.age=30;
7 alert(p1.name+p1.age);

js에서 대상 속성은 동적으로 추가되며 대상 속성은 "."을 사용할 수 있습니다또는 ['''] 이 두 가지 형식으로 표현해 주세요.
대상의 속성은 문자열, 숫자, 대상 등 모든 데이터 형식일 수 있습니다
 
8. 키워드 세 개
constructor: 대상의 구조기를 되돌려줍니다.
typeof: 데이터 형식 반환
instanceof: 대상이 어떤 종류의 실례인지 판단

 1 function Person(){
 2     alert('hello');
 3 }
 4 var p1 = new Person();
 5 p1.name='zhangsan';
 6 p1.age=30;
 7 alert(p1.name+p1.age);
 8 
 9 // p1 
10 alert(p1.constructor);
11 // p1 
12 alert(typeof p1);
13 // p1 Person 
14 alert(p1 instanceof Person);

 
9. 대상이 메모리에서의 표현 형식

1 // 1
2 function Person(){
3 }
4 var p1 = new Person();
5 p1.name='zhangsan';
6 p1.age=30;
7 
8 var p2 = new Person();
9 alert(p2.name);

예1에서 p1 대상을 만들 때 p1에 해당하는 퇴적 공간을 열어주고name와age 속성 및 값을 p1이 가리키는 퇴적 공간에 추가한다. p2 대상을 만들 때 p2 대상에 대응하는 공간을 열어주지만 p2가 가리키는 퇴적 공간은 비어 있기 때문에 P2 대상은name와age 속성이 없다.

 1 // 2
 2 function Person(){
 3 }
 4 var p1 = new Person();
 5 p1.name = 'zhangsan';
 6 p1.age = 30;
 7 
 8 var p2 = p1;
 9 alert(p2.name);
10 p2.name = 'lisi';
11 alert(p2.name);
12 alert(p1.name);

예2에서 p1창고에 저장된 더미의 주소를 p2에 부여했기 때문에 p2도 p1이 가리키는 더미의 주소를 가리켰다.두 대상이 같은 메모리를 가리키기 때문에 한 대상의 속성을 바꾸면 다른 대상에게 영향을 줄 수 있다.

 1 // 3
 2 function Person(){
 3 }
 4 var p1 = new Person();
 5 p1.name = 'zhangsan';
 6 p1.age = 30;
 7 
 8 var p2 = p1;
 9 alert(p2.name);
10 p2 = null;
11 alert(p1.name);
12 alert(p2.name);

예 3에서 P2=null;p2가 차지하는 창고 공간을 방출하지만 p1의 공간은 보류하고 p1은 상응하는 창고 공간을 가리키기 때문에 p2를 삭제하면 p1의 대상에 영향을 주지 않는다.