【第1章】オブジェクト指向

| クラス作成、コンストラクター、メソッド

クラスを作成する

class name {
	// class body
}

var xx = new name()

コンストラクタ

class Person {
    constructor(name,age) { // constructor 构造方法或者构造函数
        this.name = name;
        this.age = age;
    }
}

インナーメソッド

class Person {
    constructor(name,age) { // constructor 构造器或者构造函数
        this.name = name;
        this.age = age;
    }
    say() {
    	console.log(this.name + '你好');
    }
}

コード例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        class Person {
            //构造函数 默认名字是constructor(){}
            constructor(name , age){
                //JS可以动态生成熟悉
                this.name = name;
                this.age = age;
            }

            //类内方法  不需要加function，不需要加逗号
            say(){
                console.log(this.name + '你好');
            }
        }

        //实例化对象
        var person = new Person('Klee',8);
        person.say();//Klee你好
        
    </script>
</head>
<body>
    
</body>
</html>

| クラスの継承

継承する

class Father{ 
    // 父类
}

class Son extends Father { 
    // 子类继承父类
}

スーパーキーワード

コード例

class Father {
	constructor(surname) {
		this.surname = surname;
	}
    
	saySurname() {
		console.log('我的姓是' + this.surname);
	}
}



class Son extends Father { // 这样子类就继承了父类的属性和方法
	constructor(surname, fristname) {
		super(surname); // 调用父类的constructor(surname)
		this.fristname = fristname;
	}
	sayFristname() {
		console.log("我的名字是：" + this.fristname);
	}
}



var damao = new Son('刘', "德华");
damao.saySurname();
damao.sayFristname();

| 3 つのメモ

| 静的メンバー

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        class Person {
            
        }

        //实例化对象
        var person = new Person('Klee',8);
		person.objName = 'objName'; //通过类的实例对象声明的变量，只可通过对应的成员调用
		Person.className = 'className';//通过类直接声明的变量是静态变量，只可用类名调用
        console.log(person.objName);//objName
        console.log(person.className);//Undefined
        console.log(Person.objName);//Undefined
		console.log(Person.className);//className
    </script>
</head>
<body>
    
</body>
</html>

| プロトタイプオブジェクト __ _proto___

コンストラクターの欠点: 新しいオブジェクトが作成されるたびに、コンストラクターのためにメモリ内に新しいメモリ空間を開く必要があります。
したがって、すべてのオブジェクトに共通のプロパティとメソッドをプロトタイプオブジェクトプロトタイプに入れることができます。
プロトタイプは、すべてのオブジェクトが持つ組み込みオブジェクトです。オブジェクトには、コンストラクターのプロトタイププロトタイプオブジェクトを指すプロパティ proto が含まれます。オブジェクトがコンストラクターのプロトタイププロトタイプオブジェクトのプロパティとメソッドを使用できる理由は、オブジェクトがプロトタイププロトタイプを持っているためです。
protoオブジェクトプロトタイプとプロトタイプオブジェクトプロトタイプは同等です
protoオブジェクトプロトタイプの重要性は、オブジェクト検索メカニズムに方向またはルートを提供することですが、これは非標準属性であるため、実際の開発ではこの属性は使用できず、内部的にプロトタイプを指すだけです。オブジェクトのプロトタイプ

オブジェクトプロトタイプ ( proto ) とコンストラクター (prototype) プロトタイプオブジェクトには、コンストラクタープロパティというプロパティがあります。コンストラクターは、コンストラクター自体を参照するため、コンストラクターと呼びます。
一般に、オブジェクトのメソッドはコンストラクターのプロトタイプオブジェクトに設定されます。複数のオブジェクトメソッドがある場合、オブジェクトの形式でプロトタイプオブジェクトに値を割り当てることができますが、これによりコンストラクタープロトタイプオブジェクトの元のコンテンツが上書きされるため、変更されたプロトタイプオブジェクトコンストラクターは現在のメソッドを指さなくなります。コンストラクタ。この時点で、変更されたプロトタイプオブジェクト内の元のコンストラクターを指すコンストラクターを追加できます。
JavaScript メンバー検索メカニズム:

一般に、パブリックプロパティをコンストラクターに配置し、パブリックメソッドをプロトタイプオブジェクトに配置します。
コンストラクターの this はインスタンスオブジェクトを指します。メソッドはプロトタイプオブジェクトに配置され、このメソッドの this はメソッドの呼び出し元 (インスタンスオブジェクト) を指します。

つまり、コンストラクターとプロトタイプ関数の this はすべて、[[現在コンストラクター/プロトタイプ関数を呼び出しています]] のインスタンスオブジェクトを指します。
コード例:

[パート VI | 高度な JavaScript] 1: オブジェクト指向

【第1章】オブジェクト指向

| クラス作成、コンストラクター、メソッド

| クラスの継承

| 3 つのメモ

| 静的メンバー

| プロトタイプオブジェクト __ _proto___

| クラスの性質

おすすめ

[パート VI | 高度な JavaScript] 1: オブジェクト指向

【第1章】オブジェクト指向

| クラス作成、コンストラクター、メソッド

| クラスの継承

| 3 つのメモ

| 静的メンバー

| プロトタイプ オブジェクト __ _proto___

| クラスの性質

おすすめ

| プロトタイプオブジェクト __ _proto___