锐客网

  1. 首页 > it技术 > >

微信小程序（JS逻辑文件）

ECMAScript 在大部分开发者看来，ECMAScript和JavaScript表达的是同一种含义，但是严格的说，两者的意义是不同的。
ECMAScript是一种由Ecma国际通过ECMA-262标准化的脚本程序设计语言， JavaScript 是 ECMAScript 的一种实现。
简介：
ECMAScript(简称ES)是一个语言标准，javascript则是基于这个标准实现的脚本语言。
发展历史：
①命名：
javascript于1996年发布了第一版，当时的名字其实不叫javascipt，而是叫livescript，不过发布之后一直不温不火，正好这个时候sun公司推出来了一个面向对象的语言—Java，Java拥有很好的跨平台特性，所以很快得到了市场的认可。
②改名：
为了蹭Java的热度，livescript的母公司Netscape网景公司，就将livescript改为javascript，事实证明，这次名字改的非常明智。
③三足鼎立：
javascript的火爆引起了微软公司的注意，他们很快也推出了Jscript脚本语言，以此来抗衡Netscape公司，并且当时还有一门浏览器脚本语言，叫ScriptEase，这样市场上就有了三种脚本语言，并且各个语言各有特色，互不兼容。
④制定规范
1997年，Netscape给欧洲计算机制造商协会(European Computer Manufacturers Association，简称ECMA)提交了一个草案，要求根据javascript来制定一个浏览器脚本语言标准。
ECMA邀请了Netscape、Sun、微软、Borland和其他一些对脚本编程感兴趣的公司的程序员组成了一个技术委员会—第 39 技术委员会(TC39)，共同商讨制定了一个脚本语言的规范：ECMAScript。各个脚本语言必须按照规范来实现和约束自己的功能。
当然这个规范也是不断发展的，第一版规范叫做：ECMA-262，现在则以es+年份来命名，基本每年发一次新规范。
由此，JavaScript 的正式名称是 ECMAScript 。
⑤近期发布
2011年6月发布ECMAscript 5版本
2013年3月，ECMAScript 6草案冻结，不再添加新功能。新的功能设想将被放到ECMAScript 7。2013年12月，ECMAScript 6草案发布。然后是12个月的讨论期，听取各方反馈。2015年6月17日，ECMAScript 6发布正式版本，即ECMAScript 2015。所以ECMAScript 2015简称ES6。ES5和ES6
⑥分析：
关于Netscape为什么要提交草案建立标准，有一种说法是为了提高javascript的权威性，和行业影响力
JS是 ECMAScript 一种实现后，即ES是一个语言标准，JS则是基于这个标准实现的脚本语言。
理解这个关系可以帮助开发者理解小程序中的 JS同浏览器中的JS以及 NodeJS 中的JS是不相同的。
ECMA-262 规定了 ECMAScript 语言的几个重要组成部分：
语法、类型、语句、关键字、操作符、对象
浏览器的JavaScript
浏览器中JavaScript 构成如下图：
微信小程序（JS逻辑文件）
文章图片

浏览器中的JavaScript 是由 ECMAScript 和 BOM（浏览器对象模型）以及 DOM（文档对象模型）组成的，Web前端开发者很熟悉这两个对象模型，它使得开发者可以去操作浏览器的一些表现。
NodeJS的JavaScript NodeJS中JavaScript 构成如下图：
微信小程序（JS逻辑文件）
文章图片

NodeJS中的JavaScript 是由 ECMAScript 和 NPM以及Native模块组成，NodeJS的开发者会非常熟悉 NPM 的包管理系统，通过各种拓展包来快速的实现一些功能
小程序的JavaScript
同开发者所熟悉的以上两个环境是不同的，小程序中 JavaScript 构成如图
微信小程序（JS逻辑文件）
文章图片

小程序中的 JavaScript 是由ECMAScript 以及小程序框架和小程序 API 来实现的。
注意：
①同浏览器中的JavaScript 相比没有 BOM 以及 DOM 对象，所以类似 JQuery、Zepto这种浏览器类库是无法在小程序中运行起来的，
②因为缺少 Native 模块和NPM包管理的机制，小程序中无法加载原生库，也无法直接使用大部分的 NPM 包。
小程序执行环境 明白了小程序中的 JavaScript 同浏览器以及NodeJS有所不同后
开发者还需要注意到另外一个问题，不同的平台的小程序的脚本执行环境也是有所区别的。
小程序目前可以运行在三大平台：
①iOS平台，包括iOS9、iOS10、iOS11
②Android平台
③小程序IDE
这种区别主要是体现三大平台实现的 ECMAScript 的标准有所不同。截止到当前一共有七个版本的ECMAScript 标准
兼容问题：
目前开发者大部分使用的是 ECMAScript 5 和 ECMAScript 6 的标准，但是在小程序中， iOS9和iOS10 所使用的运行环境并没有完全的兼容到 ECMAScript 6 标准，一些 ECMAScript 6 中规定的语法和关键字是没有的或者同标准是有所不同的，例如：箭头函数、let const、模板字符串等…
方案：
一些开发者会发现有些代码在旧的手机操作系统上出现一些语法错误。为了解决这类问题，小程序IDE提供语法转码工具，将 ECMAScript 6代码转为 ECMAScript 5代码，从而在所有的环境都能得到很好的执行。
开发者需要在项目设置中，勾选 ES6 转 ES5 开启此功能
微信小程序（JS逻辑文件）
文章图片

模块化 浏览器中，所有 JavaScript 是在运行在同一个作用域下的，定义的参数或者方法可以被后续加载的脚本访问或者改写。
同浏览器不同，小程序中可以将任何一个JavaScript 文件作为一个模块，通过module.exports 或者 exports 对外暴露接口。
模块示例：
B.js 引用模块A，并使用A暴露的方法完成排序的操作
header.js文件引用sort.js暴露的模块，完成排序操作
①根目录下新建data→sort.js文件 ②编写模块，进行导出暴露
微信小程序（JS逻辑文件）
文章图片

③header.js文件利用require导入模块
微信小程序（JS逻辑文件）
文章图片

④使用模块暴露导出的排序方法进行排序
微信小程序（JS逻辑文件）
文章图片

以上案例便调用了sort.js导出的模块，实现数组元素排序，即小程序的模块化思想。
脚本执行顺序 执行顺序：
浏览器中脚本严格按照加载的顺序执行，即自上而下执行
小程序中的脚本执行顺序有所不同，小程序的执行的入口文件是 app.js ，并且会根据其中 require 的模块顺序决定文件的运行顺序
app.js示例：
微信小程序（JS逻辑文件）
文章图片

作用域 同浏览器中运行的脚本文件有所不同，小程序的脚本的作用域同 NodeJS 更为相似。
在文件中声明的变量和函数只在该文件中有效，不同的文件中可以声明相同名字的变量和函数，不会互相影响
案例：
①在脚本 a.js 中定义局部变量
微信小程序（JS逻辑文件）
文章图片

【微信小程序（JS逻辑文件）】②在脚本 b.js 中无法访问 a.js 定义的变量
微信小程序（JS逻辑文件）
文章图片

局变量设置：
当需要使用全局变量的时，通过使用全局函数 getApp() 获取全局的实例，并设置相关属性值，来达到设置全局变量的目的
案例：
①在脚本 a.js 中设置全局变量
微信小程序（JS逻辑文件）
文章图片

②在脚本 b.js 中访问 a.js 定义的全局变量
微信小程序（JS逻辑文件）
文章图片

注意：上述示例只有在 a.js 比 b.js 先执行才有效，当需要保证全局的数据可以在任何文件中安全的被使用到，那么可以在 App() 中进行设置
app.js定义全局变量
定义全局变量num（userInfo为用户数据，暂时不用关注）
微信小程序（JS逻辑文件）
文章图片

操作全局变量
①获取以及修改 global 变量的方法
微信小程序（JS逻辑文件）
文章图片

②获取 更改后的global 变量
微信小程序（JS逻辑文件）
文章图片

    推荐阅读


    上一篇：VUE实现图片懒加载

    下一篇：mysql主从复制，导致主从数据不同步的原因和解决方法