小程序开发JavaScript基础知识点
Javascript简介
Javascript(JS)是动态解释性编程语言,运行在虚拟机上,虚拟机实现最终调用计算机硬件资源计算。当前比较出名的虚拟机为chrome V8引擎。JS是弱类型语言,使用var, let来定义变量,使用function定义函数,使用prototype属性+new关键字模拟面向对象的继承,ES6中增加class关键字,其实是基于prototype继承模式的语法糖,同时略有区别,例如:
JS解释运行时,虚拟机模拟x86的运行堆栈,运行时查找变量的类型遵循LEGB(Local-Enclosing-Global-Buildin)规则,e为enclosing环境,解决函数嵌套时候的变量的查找,使得JS支持闭包函数。
Promise实现异步
ES6标准中原生提供了Promise对象,理解为一个容器,用于异步执行程序,Promise有三种状态(pendding,fulfield,rejected),可以设置状态改变后的回调函数,注意:Promise被new出来之后会立即执行构造时传入的函数,形如function(resolve,reject) {...},(resolve在向下传递参数时,只能传一个参数)
结合的async/await,优化代码结构,可以不是用then,可以使异步代码看起像同步代码,同时便于调试
function readFile () {
return new Promise((resovle, reject) => {
setTimeout(() => {
console.log('read file completed!')
resovle()
}, 1000)
})
}
function main () {
console.log('prepare!!!!')
readFile().then(() => {
console.log('finish')
})
}
async function main () {
console.log('prepare!!!!')
await readFile()
console.log('finish')
}
main()
JavaScript模块化
JS模块引入有几种方案:CommonJS,AMD,CMD,UMD,ES6 import等
CommonJS, module是这种规范中对当前模块的引用,理解为类的this,exports是输出的接口集合,CommonJS模块使用require引入,最常用。
AMD,异步加载
UMD,Universal Module Definition,兼容CommonJS和AMD,所以常用,但是代码量偏大。
ES6 import,一个模块就是一个独立的文件。该文件内部的所有变量,外部无法获取。export 命令用于规定模块的对外接口。import 命令用于输入其他模块提供的功能。ES6 模块的设计思想是尽量的静态化,使得编译时就能确定模块的依赖关系,以及输入和输出的变量。(这段是抄的)
Webpack打包
通过webpack可以将多个JS文件,甚至包括图片,css等文件,打包合并成一个文件,方便引用。提供给第三方的api可以通过libraryTarget指定为umd,就可以方便的提供给第三方使用。具体配置细节https://www.webpackjs.com/concepts/,小程序框架wepy就使用了webpack,并且进行了封装使用。vue框架可以通过vue-cli命令行使用,打包也是通过webpack。
如果需要js sdk提供给第三方,比如说:提供给其他小程序使用,则可以使用webpack,打包umd模块提供给第三方。
以上是开发小程序的Javascirpt方面需要掌握的基本知识,JS的基本语法是基础了,同时掌握以上几个点,进行小程序开发JS方面就足够了。