Apakah ahli statik kelas dalam es6

Dalam ES6, sifat dan kaedah yang dipanggil terus oleh kelas dipanggil ahli statik. Jika anda menambah kata kunci statik pada pembolehubah atau fungsi dalam kelas, ia adalah ahli statik tidak akan dijadikan sebagai elemen objek baharu. Perbezaan antara ahli statik dan ahli instance: 1. Ahli instance tergolong dalam objek tertentu, manakala ahli statik dikongsi oleh semua objek 2. Ahli statik diakses melalui nama kelas atau pembina, dan ahli instance diakses melalui objek instantiated.

Persekitaran pengendalian tutorial ini: sistem Windows 7, ECMAScript versi 6, komputer Dell G3.

Berorientasikan objek

Idea utama berorientasikan objek ialah menguraikan masalah yang perlu diselesaikan menjadi objek objek bukan untuk melaksanakan langkah , tetapi untuk menerangkan tingkah laku setiap objek dalam menyelesaikan masalah Teras berorientasikan objek ialah objek.

Kelebihan berorientasikan objek:

• Modulariti yang lebih mendalam dan enkapsulasi kuat
• Lebih mudah untuk melaksanakan logik perniagaan yang kompleks
• Lebih mudah untuk mengekalkan, menggunakan semula dan mengembangkan

Ciri berorientasikan objek:

• Encapsulation: Objek ialah atribut dan Gabungan tingkah laku
• Polimorfisme: Mesej yang sama akan mempunyai kesan yang berbeza apabila diterima oleh objek yang berbeza
• Warisan: Subkelas boleh mewarisi maklumat daripada kelas induk

objek ES6- sintaks berorientasikan

ES6: ES ialah singkatan ECMAScript, iaitu spesifikasi sintaks JavaScript. ES6 berkembang pada ES5 dan menambah teknologi berkaitan pengaturcaraan berorientasikan objek dan konsep kelas.

Kelas dan Objek

Kelas: Koleksi dengan sifat dan kelakuan yang sama dipanggil kelas (kelas ialah abstraksi objek ), dalam kelas Kebanyakan data hanya boleh diproses menggunakan kaedah kelas ini.
Objek: Ia adalah contoh kelas (ia adalah penumpuan kelas)

kata kunci kelas: Digunakan untuk mentakrifkan kelas

class 类名{// "类名"是一个用户标识符 通常建议首字母大写
           属性;
           函数;
}

Pembina

Gunakan pembina() dalam ES6 untuk mentakrifkan pembina Fungsinya adalah untuk memulakan sifat (pembolehubah ahli) objek . Jika pengguna tidak mentakrifkan fungsi pembina, sistem akan menjana pembina lalai tanpa parameter.

Fungsi ahli biasa

函数名([参数]){
     函数体语句
}

变量名 = function([参数]){
      函数体语句
}

            class Person{
                constructor(name,age,sex){// 构造函数 初始化对象的成员
                    this.name = name;// this指向构造函数新创建的对象
                    this.age = age;
                    this.sex = sex;
                }
                    tt = function(){ //普通的成员函数
	                    console.log(this.name);
	                    console.log(this.age);
	                    console.log(this.sex);
                	}	
            }
            var p = new Person('李相赫',25,'男')// p1是一个对象 通过调用构造函数对p1的三个属性进行了初始化
            p.fun();

        class Circle{// 定义类Circlie
            constructor(r){
                this.radius = r;
            };
            area(){ // 计算圆的面积
                var s = Math.PI*this.radius**2;
                return s;
            };
            // 计算圆的周长
            CircleLength = function(){
            return 2*Math.PI*this.radius;
            };
        };
        var c1 = new Circle(5);
        console.log('半径为5的圆的面积='+c1.area());
        console.log('半径为5的圆的周长='+c1.Circle_length());

Keputusannya adalah seperti berikut:

		// 用类实现简单的四则运算
        class Number{// 定义类Number
            constructor(n1,n2){
                this.n1=n1;
                this.n2=n2;
            };
            add(){
                var sum = this.n1+this.n2;
                return sum;
            };
            sub(){
                var sum1 = this.n1-this.n2;
                return sum1;
            };
            mut(){
                var sum2 = this.n1*this.n2;
                return sum2;
            };
            p(){
                if(this.n2!=0){
                    var sum3 = this.n1/this.n2;
                    return sum3;
                }
            }
        }
        var p1 = new Number(12,21);
        console.log(p1.add());
        console.log(p1.sub());
        console.log(p1.mut());
        console.log(p1.p());

Warisan kelas dalam ES6

Dalam JavaScript, warisan digunakan untuk mewakili hubungan antara dua kelas dan subkelas boleh Warisi beberapa atribut dan kaedah kelas induk, dan kemudian tambahkan atribut dan kaedah unik anda sendiri selepas pewarisan.

Sintaks:

class 子类名 extends 父类名{
       函数体语句;
};

Nota tentang warisan:

• Kelas induk mesti telah mentakrifkan subkelas
• Juga dikenali sebagai kelas terbitan boleh mewarisi sifat dan fungsi kelas induk
• Subkelas tidak boleh mewarisi pembina kelas induk

kata kunci super

Subkelas tidak boleh mewarisi pembina kelas induk Jika anda ingin memanggil pembina kelas induk, anda boleh menggunakan kata kunci super.

**Nota:** Jika super digunakan dalam pembina subkelas untuk memanggil pembina kelas induk, pernyataan panggilan mestilah pernyataan pertama pembina subkelas

Panggil pembina Kelas induk

super([参数])

memanggil fungsi ahli biasa

super.函数名([参数])

mengatasi kaedah

jika fungsi yang ditakrifkan dalam subkelas ialah berbeza daripada fungsi yang ditakrifkan dalam kelas induk Fungsi mempunyai nama yang sama, dan fungsi subkelas mengatasi fungsi dalam kelas induk Anda boleh memanggil fungsi ahli biasa kelas induk dengan nama yang sama dalam subkelas untuk menyelesaikan masalah daripada

        class Father{ //父类(基类或超类)
            constructor(type,color){
                this.type = type;
                this.color = color;
            }
            money(){
                console.log(100);
            }
            show(){
                console.log('类型：'+this.type);
                console.log('颜色：'+this.color);
            }
        }
        class Son extends Father{ //Son是子类(又称派生类)
            constructor(type,color,weight){
                super(type,color); //调用父类的构造函数 要放在首位
                this.weight = weight;
            };
            show(){
                super.show();// 调用父类的普通成员函数
                console.log('重量：'+this.weight);
            };
            other(){
                return '子类的其他方法';
            };
        };
        var s1 = new Son('iPhone 12','黑色','3000g');//s1为子类的实例
        s1.show();
        console.log(s1.other());

ahli statik dan ahli instance

ahli statik: ahli diakses melalui nama kelas atau pembina

ahli instance : Ahli yang diakses melalui objek Instance dipanggil ahli instance

Perbezaan:

• Ahli instance tergolong dalam objek tertentu, manakala ahli statik adalah semua objek Dikongsi
• ahli statik diakses melalui nama kelas atau pembina dan ahli instance diakses melalui objek instan

Tentukan sifat statik dalam ES5

        function Student(name,age,sex){
            Student.school = '西安邮电大学';// school是静态成员
            this.name = name;
            this.age = age;
            this.sex = sex;// name age sex都是实例成员
            this.show = function(){
                console.log('姓名：'+this.name);
                console.log('年龄：'+this.age);
                console.log('性别：'+this.sex);
            };
        };
        var f = new Student('李相赫',23,'男');
        f.show();
        console.log(Student.school);// 西安邮电大学
        console.log(f.school);// undefined

Takrifan sifat statik dalam ES6

1 kelas dahulu

2. Tentukan sifat statik di luar kelas Atribut: nama kelas statik

        class Foo{
            constructor(){
                this.color = '红色';// color是实例成员
            }
        }
        Foo.prop = 45;// prop是静态成员
        var f1 = new Foo();
        console.log('静态属性：'+Foo.prop);// 45
        console.log(f1.prop);// undefined

Takrifan atribut statik dalam ES7

Gunakan statik. kata kunci apabila mentakrifkan kelas untuk mentakrifkan atribut statik

        class Foo{
            static prop = 45; //prop是静态成员
            constructor(){
                this.color = '红色';
            }
        }
        var f2 = new Foo();
        console.log('静态属性：'+Foo.prop);// 45
        console.log(f2.prop);// undefined

Perbezaan antara kelas dan pembina

Kaedah ahli dalam kelas ditakrifkan dalam kelas . Selepas menggunakan kelas untuk mencipta objek, kaedah objek ini semua merujuk cara yang sama untuk menjimatkan ruang memori.

	class Person {
		sing(){
			console.log('hello');
		}
	}
	var p1 = new Person();
	var p2 = new Person();
	console.log(p1.sing === p2.sing);	// 输出结果：true

[Cadangan berkaitan: tutorial video javascript, bahagian hadapan web]

Atas ialah kandungan terperinci Apakah ahli statik kelas dalam es6. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!