微信小程序07-JavaScript,WXS介绍

  • JavaScript 介绍 和小程序的组成
  • WXS的介绍

一、JavaScript 介绍 和小程序的组成

微信小程序07-JavaScript,WXS介绍_第1张图片

小程序的组成微信小程序07-JavaScript,WXS介绍_第2张图片
小程序宿主环境差异

iOS上小程序代码运行到JavaScriptCore上,由wky渲染
android: 通过X5JScore解析,X5内核渲染
IDE:在微信开发者工具中,小程序nwjs 上运行
所以最好在真机调试
微信小程序07-JavaScript,WXS介绍_第3张图片

二、 WXS的介绍

WXS:其实是对JavaScript做了一个上层的封装和限制。

WXS 结合 WXML 构建页面视图的结构内容,通常使用WXS做一个过滤和计算处理。

WXS 的语言特性:
微信小程序07-JavaScript,WXS介绍_第4张图片

  • WXS的模块特性:

代码例子:

WXS可以通过标签来声明,也可以通过文件声明。文件需要
命名.wxs 后缀。在wxs模块里面,他有自己独立的作用域,每个模块定义的变量和函数都是私有的。

index.wxml
声明了wxs模块,这里用wxs 标签来声明,wxs 模块的模块名用module属性来定义,在wxs 模块外,使用view标签,在里面引入wxs模块的message的变量。
WXS定义的变量对外都是不可见的,通过module.exports属性 可以将模块内的变量和函数暴露出来使用。

在wxs模块内,可以通过require引入其他wxs文件。
在index.wxml文件内,通过wxs标签来引入了外部wxs文件所定义的模块,这里的src是外部wxs文件的路径,module 属性是外部wxs文件对应的文件名。

m2.wxs
在该文件中引入了require函数,引入了m1.wxs的模块,然后在index.wxml文件里,使用我们声明的wxs模块声明的变量。注意在同一个页面不要重复去声明,wxs模块名,否则后面的wxs模块名会覆盖前面的定义的wxs模块。

微信小程序07-JavaScript,WXS介绍_第5张图片

WXS有7种常用的运算符:
基本运算符: + - * /
一元运算符: ++ , –

微信小程序07-JavaScript,WXS介绍_第6张图片

WXS语句和javascript语句基本一样,if else ,do while ,switch

区别wxs不支持try catch.

  • WXS的数据类型:

微信小程序07-JavaScript,WXS介绍_第7张图片
regexp:正则类型 function:函数类型
生成date对象需要用getDate函数,生成regexp需要用getRegexp函数。
判断wxs的数据类型可以通过construct 判断,
其他基础类库,es5标准,javascript 中去查。微信小程序07-JavaScript,WXS介绍_第8张图片

了解下就可以,可忽略

微信小程序07-JavaScript,WXS介绍_第9张图片

bom:浏览器的对象模型,处理浏览器窗口和框架,描述了与浏览器进行交互的方法和接口,修改url,重新打开浏览器的窗口。
dom:浏览器的文档对象模型 html xml 的应用程序接口,加载到浏览器的当前网页,通过js,读取当前网页的dom对象。

微信小程序07-JavaScript,WXS介绍_第10张图片

Native:原生的模块,通过这个模块使用JavaScript本身不具备的能力。
NPM:包管理系统,最大的开源库生态系统。可以通过各种NPM扩展包快速的实现一些功能。
Nodejs:基于谷歌的V8引擎实现的JavaScript运行时。使用高效轻量级的事件驱动,以及非阻塞的io模型,通常作为后端使用。

你可能感兴趣的:(微信小程序)