首页IT科技javascript(JS中关于Class类的静态属性和静态方法)

javascript(JS中关于Class类的静态属性和静态方法)

时间2025-09-10 19:15:41分类IT科技浏览9531
导读:一、类的两个概念 1、类自身;...

一                  、类的两个概念

1                            、类自身;

2         、类的实例对象;

总的来说:静态的是指向类自身                   ,而不是指向实例对象                           ,主要是归属不同         ,这是静态属性                   ,静态方法的核心                  。

二         、对象的两个部分

1                            、属性

分为:实例属性                  、静态属性(类属性)         、只读属性

2                            、方法

分为:实例方法                  、静态方法(类方法)

class Person {   //1、定义方法   /* 1.1                            、实例属性                           ,直接定义的属性         ,要new实例后          ,实例去访问的*/   name= "tom";   age = 10;   /* 1.2                            、静态属性(类属性)                           ,通过static开头的属性                  ,Person类可以访问,     不需要创建实例          ,实例访问不到 */   static height = 180;   /* 1.3、只读属性                            ,readonly开头的属性                  ,只可读,不可改*/   readonly money= 1000;     //2                  、定义方法     say(){       console.log(hello world);       }   static work(){       console.log(我能挣钱);       } } const per = new Person(); //per.money=2000  报错                            ,不可修改 console.log(per, Person.height); per.say()  //调用实例方法 Person.work() //调用类方法

三                            、静态方法使用:在方法前加上static关键字

1         、为什么使用静态方法

阻止方法被实例继承                           ,类的内部相当于实例的原型,所有在类中直接定义的方法相当于在原型上定义方法                   ,都会被类的实例继承                           ,但是使用static静态方法定义的不会被实例继承                            。

  class User{             static call(){                console.log(你好呀);             }         }       User.call()//你好呀         let ff = new User()       ff.call()//报错         ,实例不能访问类的静态方法

这里类User可以直接使用call方法                   ,但它的是实例ff却不可以!

但是我们可以通过继承的方式                           ,让另一个类来继承User里面的方法

class User{             static call(){                console.log(你好呀);             }         }            class foo extends User{}      foo.call()//你好呀    

这里foo类通过继承User类         ,才可以使用User里面的静态方法         。

我们知道class类这个概念是es6后出来的新特性          ,用以前的es5方法写就是:

 class User{             static call(){                console.log(静态方法的你好呀);             }             call(){                console.log(构造函数方法的你好呀);             }         }   //等同于 function User(){}      User.call=function(){          console.log(静态方法的你好呀);      }         User.prototype.call=function(){          console.log(构造函数方法的你好呀);      }

但是User类里面的构造函数方法是可以被实例调用的                           ,如图:

function User(){} User.prototype.call=function(){          console.log(你好呀);      }      let h1 =new User()      h1.call()//你好呀

完整版如下

class User {             call() {                 // 这里面的this指向构造函数的对象                 console.log(this === hh); // true                 console.log("构造函数方法的你好呀");             }             static call() {                 // 这里面的this指向类本身                 console.log(this === User); // true                 console.log("静态方法的你好呀");             }         }         // 静态方法         User.call(); //静态方法的你好呀           // 构造函数方法         let hh = new User();         hh.call(); //构造函数方法的你好呀

三                  、总结

1                            、静态属性和非静态属性的区别

在内存中存放的位置不同:所有static修饰的属性和方法都存放在内存的方法区里                  ,而非静态的都存在堆内存中 出现的时机不同:静态属性和方法在没创建对象之前就存在          ,而非静态的需要在创建对象才存在 静态属性是整个类都公用的 生命周期不一样                            ,静态在类消失后被销毁                  ,非静态在对象销毁后销毁 用法:静态的可以直接通过类名访问,非静态只能通过对象进行访问

2.使用static的注意事项

带静态修饰符的方法只能访问静态属性 非静态方法既能访问静态属性也能访问非静态属性 非静态方法不能定义静态变量 静态方法不能使用this关键字 静态方法不能调用非静态方法                            ,反之可以

以上为个人经验                           ,希望能给大家一个参考,也希望大家多多支持本站         。

声明:本站所有文章                   ,如无特殊说明或标注                           ,均为本站原创发布                            。任何个人或组织         ,在未征得本站同意时                   ,禁止复制         、盗用         、采集                            、发布本站内容到任何网站                  、书籍等各类媒体平台                  。如若本站内容侵犯了原著者的合法权益                           ,可联系我们进行处理         。

创心域SEO版权声明:以上内容作者已申请原创保护,未经允许不得转载,侵权必究!授权事宜、对本内容有异议或投诉,敬请联系网站管理员,我们将尽快回复您,谢谢合作!

展开全文READ MORE
网站布局方案怎么做(网站布局方案有哪些) 浏览器主页被更改(打开浏览器时,浏览器主页被篡改怎么办?)