前言
JS是弱定义语言,最适合用于前端的数据处理。因为前端是数据的终点,用完就抛弃,所以前端一般都只是处理简单的业务逻辑。
但是有时候我们希望前端能进行一些复杂的处理,比如SqlLite本地缓存数据库,或者前端处理一些业务逻辑,或者程序可以离线使用,这个时候就要用到模块化的解决方案
如何定义类,或者如何模仿类
这个时候就要用到面向对象的想法,什么是面向对象,就是把所有的过程抽象成一个物体执行的指令
举一个把鸡蛋放进冰箱的例子
面向过程
面向对象:这里有三个对象,鸡蛋,我,冰箱
面向对象的优点就是我们只需要在类定义的时候把方法定义好,后面调用的时候我只用调用方法就行了,不需要考虑冰箱是如何打开的。尤其是JS这种弱定义语言,没有强类型校验,更容易出现问题。
所以JS如何定义一个类似于类的对象呢?
如何定义类
这里有两个方案,我推荐方案二,方便类型扩展
方案一:原型链/对象访问器
这个就是我的痛处了,我是2022年应届毕业生,去年去字节面试的时候一面问了这个问题直接挂掉了。主要是自己准备不充分,大三被家里逼着去考研去了。具体内容可以看我这篇自传:《关于我放弃复试去工作这件事情》
原型链基本使用
简单来说,原型链就是给我们个扩展方法,我们可以不断地去propoto上面添加方法。常见的就是js的Date.formate方法(自定义格式化方法,Date日期没有格式化方法要自己写)。
或者使用对象访问器,即Get和Set方法,可以访问内部变量
对象访问器简单使用
方案二:封装一个JS文件
上面的方法并不是最优解,因为我们需要多个地方调用这个方法,所以我们希望能将一类方法统一放到一个文件里面,比如上述的例子中,就可以新建一个冰箱的js文件,存放所有冰箱的操作
那么如何导出引用一个js文件呢?
导出文件
使用module.exports={}这个方法
SqlTest.js文件
var data = "data"
module.exports = {
test: data
}
引入文件
使用 require方法
const SqlTest = require('./SqlTest')
console.log(SqlTest.test)//"data"
debugger;
使用import方法(要在Vue框架内,效果和require一致)
// const SqlTest = require('./SqlTest')
import SqlTest from './SqlTest';
console.log(SqlTest.test)
debugger;
如果直接导入会报错