通过wxs文件，动态改变前端特定字体颜色以及对wxs的详解和wxs中的几种数据类型(重要)

效果如图所示，点位状态根据是否故障改变颜色
wxs文件 - utils-color.wxs 代码如下

function fontColor(str){
  var color = "";
  if(str.indexOf("故障") >= 0)
    color = "red";
  else
    color =  "#999";
  return color;
}

//导出wxs内部私有变量和函数 ，只能通过module.exports
module.exports = {
  fontColor: fontColor
}

前端wxml文件
首先引入wxs文件
然后使用

点位状态:         
          {{item.Status}}
 

参考 https://blog.csdn.net/weixin_39872588/article/details/79608221

小程序脚本语言WXS详解
WXS脚本语言是 Weixin Script脚本的简称，是JS、JSON、WXML、WXSS之后又一大小程序内部文件类型。截至到目前小程序已经提供了5种文件类型。

解构小程序的几种方式，其中一种方式就是通过文件类型：JS、JSON、WXML、WXSS、WXS。前面四种之前已经介绍过，今天主要是介绍WXS这种文件类型。如果你是PHP、JAVA、C#程序员的话写过服务端代码的话，就很好理解WXS这种脚本语言了。能够更加方便的动态实现页面上的一些基本逻辑判断，而不用全部的依赖后台实现，再通过接口返回。


不能调用小程序的api和调用其他js文件定义的程序

一、WXS创建方式
WXS的使用，有两种方式。 一种是直接在WXML中编写

另一种是写在单独的wxs文件上，就例如文章一开始使用的方式。

然后再wxml引用

二、WXS文件的构成
1、数据类型 类似小程序大厦的砖头、保暖砖、预制件之类的内容，这些都是通用的内容，这些是编程语言的基本构成项，数据类型可以是简单的类型，也可以是复杂的类型。从普通的数字再到复杂的对象。

WXS 语言目前共有8种数据类型：
number ： 数值 string ：字符串 boolean：布尔值 object：对象 function：函数 array : 数组 date：日期 regexp：正则
WXS中使用var或let来定义变量，从定义中很难看出变量的类型，判定一个变量是什么类型。 可以使用变量的属性constructor。 还可以使用 typeof这种方式来判定变量的类型
例如：

var number = 10;
 
console.log( "Number" === number.constructor );
 
console.log( 'number' === typeof number );

2、变量 变量就是构建小程序这座大厦的基本件，虽然是很小，但是有自己的规范，主要有如下几个方面： 命名规范， 首字符必须是：字母（a-zA-Z），下划线（）， 剩余字符可以是：字母（a-zA-Z），下划线（）， 数字（0-9）。 大小写不同则是不同的变量
保留字符

delete void typeof null undefined NaN Infinity var if else true false require this function arguments return for while do break continue switch case
 
default

3、操作运算符 根据操作对象的个数，可以分为一元、二元、多元运算符。 我们常用的加减乘除这些都需要两个操作对象才能完成，那这些就是二元运算符。 自增或自减这些只需要一个运算符就可以完成。这些就是一元运算符。 需要二个以上的运算对象的那就是多元运算符了。
4、选择结构 选择结构，又称为判断结构， 如果C条件满足了则执行一种情况，条件不满足则执行另外一种情况 。 另外一种是多条件的，如果C1条件满足了，则执行A部分，如果C2条件满足了则执行B部分，如果C3条件满足则执C部分，以此类推，所有条件都不满足是则执行Z部分。

// if ... else 
 
if (表达式) 语句;
 
else 语句;
 
if (表达式) 
 
语句;
 
else 
 
语句;
 
if (表达式) { 
 
代码块; 
 
} else { 
 
代码块; 
 
}
 
// if ... else if ... else ...
 
if (表达式) {
 
 代码块; 
 
} else if (表达式) { 
 
代码块; 
 
} else if (表达式) { 
 
代码块; 
 
} else { 
 
代码块; }
 
switch (表达式) { 
 
 case 变量: 
 
 语句; 
 
 case 数字: 
 
 语句; 
 
 break; 
 
 case 字符串: 
 
 语句; 
 
 default: 
 
 语句; 
 
}

5、循环结构 简单的事情，不想重复的写代码，那就可以把公共执行的部分剥离出来

for (语句; 语句; 语句) 
 
语句;
 
for (语句; 语句; 语句) {
 
 代码块; 
 
}
 
while (表达式) 
 
语句;
 
while (表达式){ 
 
代码块; 
 
}
 
do { 
 
代码块; 
 
} while (表达式)

支持使用 break，continue 关键词。 break是结束整个循环 continue是中断当前本次循环
到这里的时候就先停一下 通过1和2这两个部分完成的组件，再通过3、4、5这三大部分的“粘合剂” 就可以完成后面6和7慢慢的你会发现写小程序就是盖房子一样的，把原材料准备好，使用粘合剂给连接起来就可以了。
6、模块（自定义的函数） 在WXS中编写业务逻辑与内容，使用 moudle.exports的方式把变量或函数公开。

// /pages/tools.wxs
 
var foo = "'hello world' from tools.wxs";
 
var bar = function (d) { return d; }
 
module.exports = { 
 
 FOO: foo, 
 
 bar: bar,
 
};
 
module.exports.msg = "some msg";
 
在使用的地方地方，需要引入对就的模块才能使用
 

 
 {{tools.msg}} view>
 
 {{tools.bar(tools.FOO)}} view>

注意:tool.FOO FOO是大写，因为上面部分是使用FOO做为对外公开的变量名。
7、可使用的函数库（已经定义好的函数）

console      //控制台打印函数
 
console.log()       console.info()           console.warn()          console.error() 
 
这是引用的chrome的经典内容。
 
Math    // Math 是一个内置对象, 它具有数学常数和函数的属性和方法
Math.PI      // Math.PI 表示一个圆的周长与直径的比例，即为π = 3.14159....
Math.ceil()  //Math.ceil()是常见编程语言中的常用代码，用于向上取整数计算，返回的是大于或等于给定数字的整数值
Math.floor() //Math.floor() 返回小于或等于一个给定数字的最大整数
 
带有()是对应的方法，没有带括号的是属性，
Number
 MAX_VALUE    //Number.MAX_VALUE 表示wxs 中可表示的最大的数
MIN_VALUE      //Number.MAX_VALUE 表示wxs 中可表示的最小的数，接近0但不是负数？
 NEGATIVE_INFINITY //NEGATIVE_INFINITY 属性表示小于 Number.MIN_VALUE 的值。 该值代表负无穷大。
 POSITIVE_INFINITY //正无穷



JSON
stringify(object): //JSON.stringify(obj)   将 object 对象转换为 JSON 字符串，并返回该字符串。
parse(string):     //JSON.parse() 将 JSON 字符串转化成对象，并返回该对象。
 
Global   //全局对象
属性 
NaN  //全局属性NaN表示未定义或不可表示的值，不是一个数字。常在浮点数运算中使用
Infinity//是全局对象(global object)的一个属性,即它是一个全局变量。 Infinity 的初始值是 Number.POSITIVE_INFINITY

undefined //是全局对象的一个属性。也就是说,它是全局作用域的一个变量。undefined的最初值就是原始数据类型undefined。  --- 首先它是个变量。其他未赋值变量的值就是undefined

方法
parseInt //parseInt() 函数可解析一个字符串，并返回一个整数。
parseFloat//可解析一个字符串，并返回一个浮点数。
isNaN // 用于检查参数是否是一个非数字值
isFinite //用于检查传入的参数是否是个有限数值
decodeURI //可对 encodeURI() 函数编码过的 URI 进行解码
decodeURIComponent //encodeURIComponent() 函数编码的 URI 进行解码
encodeURI //函数可把字符串作为 URI 进行编码
encodeURIComponent //函数把字符串作为 URI 组件 进行编码

以上内容的更多用法可以参考ES语法 http://es6.ruanyifeng.com/
三、注释
单独的把这一块拿出来，一方面是说明其重要性，另一方面是学习一门语言与他人沟通中很重要的 一部分。WXS 主要有 3 种注释的方法。

module=“sample”>

// 方法一：单行注释

/* 方法二：多行注释 */

/* 方法三：结尾注释。即从 /* 开始往后的所有 WXS 代码均被注释

var a = 1;

var b = 2;

var c = “fake”;

在编程实践中，只要能把思路理清就能把代码实现出来，在大师兄的公司基本上推荐的是先写注释内容，然后再把注释内容转换为代码。

参考https://blog.csdn.net/rolan1993/article/details/77989609