浅谈 ES6 中的 static 正确使用姿势

目录

• • 前言
  • static出处
  • 实例化对象
  • 验证真伪
  • 总结

前言

昨天晚上看到一个北京小伙伴前端面试视频哈，就ES6中的static没啥印象，所以今天抽空对static稍稍谈下自己的一些理解哈，如有不正确的地方请评论指正。

static出处

自从面向对象思想出现后就一发不可收拾，大牛们在这条路上狂飙，作为菜鸡的我只能奋起追逐，只闻其声不见其身，个中滋味只有自己才能默默体会。

static 作为ES6 推出后伴随着class（类）一同出现的新产物，那么在写代码的时候肯定会经常用到，还是很有必要去了解一二。

官方的说法是：class（类）通过 static 关键字定义静态方法。不能在类的实例上调用静态方法，而应该通过类本身调用。

这里就需要了解一下：类，实例等相关知识。

通俗的说，我们在面向对象编程的过程中，将class（类）转换为对象的这个过程叫做实例化，进而生成一个实例化对象（通常叫一个实例）。

实例化对象

接下来就实例化一个对象，然后再这个实例化对象中进行去声明static函数（静态私有），例：

// class声明一个叫demo的类
class demo {// 可以在这个里面做一些事情
}// 通过new的方式生成一个实例对象
const DEMO = new demo();

通过以上方式就生成了一个实例化对象，这样就可以对这个对象进行一些操作，static就是在这个demo 类下，在这里声明两个函数，一个是通过static声明，一个不使用，然后运行看下有什么区别。如下：

class demo {// 使用static声明static nameFn(val) {console.log('name::', val)}// 没有使用static声明ageFn(val) {console.log('age::', val)return val // 如若不返回则会输出undfined}static bag = '小手包'clothing = 'T恤'}// 声明子类去继承父类demo的属性及函数
class childDemo extends demo {constructor() {super(); // 子类继承父类，需要在子类的constructor中调用super()方法，否则子类实例化会报错}
}var DEMO = new demo();
var CHILDDEMO = new childDemo();console.log('DEMO实例对象::',DEMO) // DEMO实例对象:: demo {}
console.log('CHILDDEMO实例对象::',CHILDDEMO) // CHILDDEMO实例对象:: childDemo {clothing: 'T恤'}

通过这个输出结果应该就能够明白为啥叫他为一个对象了吧（虽然皆对象），但是仅仅是这样还是看不出跟static有什么关系，别着急，接着往下看运行截图。

通过上面这个截图应该多少能够看出一些门道了吧，最浅显的是类经过实例化后，这些定义的函数出现在了实例对象的原型链上，这个是可以通过原型链能够找到的，那么也就可以通过实例对象调用原型链上的函数去执行一些操作。

但是发现一个问题没有，使用static声明的nameFn函数怎么没有出现在实例对象的原型链上呢？

验证真伪

我们可以将上面的代码运行一下即可，首先看父类demo输出

• demo（父类）

  console.log(DEMO._ _ proto _ _)

  

  console.log(DEMO._ _ proto _ _.constructor)

  

  console.log(DEMO._ _ proto _ _.constructor.prototype)

  

  console.log(DEMO.nameFn(11))

  

  在DEMO这个实例上找不到声明的nameFn函数，因为这个函数是使用static声明的，独属于demo这个类所私有。

  继而直接影响到后面代码的执行，直接给终止掉。

  console.log(DEMO.ageFn(11))

  
  此处之所以是有两条输出，前面的是ageFn这个函数体内所执行，后面的11这是ageFn函数执行完后的返回值。

  console.log(DEMO.bag)

  这里直接给返回undefined，这同样是因为static声明的静态属性所致，同样不会挂载到实例上，所以也就导致在DEMO实例上找不到bag这个属性，自然就返回undefined。

  console.log(DEMO.clothing)

  返回值：T恤，这是因为没有使用static所定义。

• childDemo（子类）

总结

这就不接着废话了，马上就揭开static的庐山真面目。

重要的事情说三遍！！！
重要的事情说三遍！！！
重要的事情说三遍！！！

static修饰的属性和方法都是静态方法和属性,只能被类名调用,不能被实例化对象调用.同时也不能被子类继承,换句话说它属于当前这个类的.

原因是：使用static声明的函数或属性是不能够被实例化对象所调用，也不能被子类所继承，而仅仅属于这个类所使用（调用）。

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！