JavaScript 생성자는 객체를 생성합니다(요약 공유)

WBOY
풀어 주다: 2022-08-04 10:16:45
앞으로
2793명이 탐색했습니다.

이 기사에서는 JavaScript 생성자에 의한 객체 생성과 관련된 문제를 주로 소개하는 javascript에 대한 관련 지식을 제공합니다. 생성자(생성자)는 생성자 및 유형 함수라고도 하며 해당 기능은 객체 템플릿과 유사합니다. 인스턴스 객체는 동일한 속성과 동작 특성을 가지고 있지만 동일하지 않습니다. 모두에게 도움이 되기를 바랍니다.

JavaScript 생성자는 객체를 생성합니다(요약 공유)

[관련 추천 : javascript 동영상 튜토리얼, 웹 프론트엔드]

생성자란 무엇인가

자바스크립트 생성자(Constructor)라고도 불리는 생성자, 타입함수로 그 기능은 비슷합니다. 객체 템플릿에 대한 생성자 함수는 인스턴스를 얼마든지 생성할 수 있습니다. 인스턴스 객체는 동일한 속성과 동작 특성을 가지지만 동일하지는 않습니다.
생성자를 사용하여 다양한 클래스의 개체를 만듭니다.

생성자 생성

생성자는 일반적인 함수입니다. 생성 방법과 일반 함수 사이에는 차이가 없습니다. 생성자와 일반 함수의 차이점은 호출 방법의 차이입니다. 직접 생성자는 새 키워드를 사용하여

이 포인팅 문제

3가지 형태의 포인팅 상황을 호출해야 합니다.
  • 함수로 호출하면 이것이 윈도우

메서드로 호출하면 누구든지 메소드를 호출하는 사람이 바로

  • 생성자로 호출하면 새로 생성되는 저 객체

  • 생성자의 실행 흐름

  • 새 개체를 즉시 생성합니다

함수에서 새 개체를 this로 설정하고 생성자에서 this를 사용하여 새 개체를 참조할 수 있습니다. 새로 생성된 객체)

  • 함수 안의 코드를 한줄씩 실행

  • 새로 생성된 객체를 반환값으로 반환

  • 동일한 생성자를 사용하여 생성된 객체를 Class 객체라고 하며, 생성자를 클래스라고도 합니다. 생성자를 통해 생성된 객체를 이 클래스의 인스턴스라고 부릅니다. 위와 관련하여 Obj는 클래스이고 obj는 Obj 클래스의 인스턴스입니다.
  • 생성자 인스턴스

  • Person 클래스 하나와 Dog 클래스 하나, 두 개의 클래스를 만듭니다.
nbsp;html>
    <meta>
    <meta>
    <meta>
    <title>Document</title>
    <script>
        //构造一个创建人的类
        function Person(name , age , gender){
            console.log(&#39;指向:&#39;,this);
            this.name = name;
            this.age = age ;
            this.gender = gender;
            this.sayName = function(){
                console.log(this.name)
            }
        }

        //构造一个创建狗的类
        function Dog(name , age ){
            console.log(&#39;指向:&#39;,this);
            this.name = name;
            this.age = age ;
            this.sayHello = function(){
                console.log(&#39;汪汪汪~~&#39;);
            }
        }

        //创建一个人的实例
        var per = new Person(&#39;苏凉&#39;,21,&#39;男&#39;);
        console.log(per);
        per.sayName();

        //创建一个狗的实例
        var dog = new Dog(&#39;旺财&#39;,5);
        console.log(dog);
        dog.sayHello();
    </script>
    
로그인 후 복사

실행 결과: JavaScript 생성자는 객체를 생성합니다(요약 공유)

생성자의 장점은 다양한 개체를 구분할 수 있다는 것입니다. 즉, 생성된 개체가 어떤 범주에 속하는지 명확하게 알 수 있습니다. 일반 개체를 사용하여 개체를 생성하는 것과 팩토리 모드를 사용하는 것 모두입니다. 객체 생성 객체의 유형을 구별하는 것은 불가능하며 모두 하나의 큰 범주(객체)에 속합니다.

instanceof 키워드

instanceof를 사용하여 객체가 클래스의 인스턴스인지 확인하세요

JavaScript 생성자는 객체를 생성합니다(요약 공유)구문: ​​

인 경우 true를 반환하고, 그렇지 않은 경우 false를 반환합니다.

  console.log(dog instanceof Dog); //true
  console.log(dog instanceof Person); //false
  console.log(dog instanceof Object); //true
로그인 후 복사

모든 객체는 Object의 자손입니다. object는 0object로 인스턴스 검사를 수행할 때 true를 반환합니다.

성능 최적화

对象 instanceof 构造函数Person 생성자 만들기

Person 생성자에는 각 개체에 대해 sayName 메서드가 추가됩니다.

현재 우리 메서드는 생성자 내부, 즉 생성자가 실행될 때마다 생성됩니다. 새로운 sayName 메서드는 생성됩니다

즉, 모든 인스턴스의 sayName은 고유합니다.

이것은 많은 메모리를 차지하며 새로 생성된 개체마다 새로운 메서드가 생성됩니다.

해결 방법: 새로 생성된 객체의 메소드를 다음과 같이 별도로 추출합니다.

nbsp;html>
    <meta>
    <meta>
    <meta>
    <title>Document</title>
    <script>
		//将新创建对象的方法单独提取出来
        function sayName(){
            console.log(this.name)
        }

        //构造一个创建人的类
        function Person(name , age , gender){
            console.log(&#39;指向:&#39;,this);
            this.name = name;
            this.age = age ;
            this.gender = gender;
            this.sayName = sayName;
        }
        var per = new Person(&#39;苏凉&#39;,21,&#39;男&#39;);
        var per1 = new Person(&#39;小红&#39;,18,&#39;女&#39;);
        console.log(per);
        per.sayName();
        per1.sayName();
        console.log(per.sayName == per1.sayName); //true
    </script>
    
로그인 후 복사

per의 sayName 메소드와 per1의 sayName 메소드가 동일한 것을 알 수 있습니다. 이는 다른 인스턴스를 생성할 때 새로운 sayName 메소드를 다시 생성하는 문제를 해결하여 메모리 사용량을 크게 줄입니다.

JavaScript 생성자는 객체를 생성합니다(요약 공유)

지식 확장

JavaScript 생성자는 객체를 생성합니다(요약 공유)

(1.) 생성자가 필요한 이유:

객체를 생성하는 처음 두 가지 방법은 한 번에 하나의 객체만 생성할 수 있기 때문입니다. (2.) 생성자란 무엇입니까?

생성자: 개체의 동일한 속성과 메서드 중 일부를 추상화하여 함수로 캡슐화합니다.

(3.)利用构造函数创建对象及使用方法

构造函数的函数名从第一个单词开始,每个单词的首写字母都要大写。

JavaScript 생성자는 객체를 생성합니다(요약 공유)

/ /4.在构造函数里面我们的属性和方法前面都必须加this关键字

//声明构造函数语法格式:
function 构造函数名() {
this.属性 = 值;
this.方法 = function() {}
}
//调用构造函数语法格式:
new 构造函数名();
로그인 후 복사

以下是构造函数语法格式的案例:

JavaScript 생성자는 객체를 생성합니다(요약 공유)

【相关推荐:javascript视频教程web前端

위 내용은 JavaScript 생성자는 객체를 생성합니다(요약 공유)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:csdn.net
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!