InoTouchPad 脚本采用的是JavaScript代码编写，具有更高的灵活性，可以完成一些运算逻辑，同时可使用系统中自带的面向对象的属性和方法，注意区分字母大小写。下面分享一些学习笔记，内容有点多，删减了挑重点讲，推荐收藏。
二、数据类型
基本数据类型：字符串（String）、数字（Number）、布尔（Boolean）、空（Null）、未定义（Undefined）；
引用数据类型：对象（Object）、数组（Array）、函数（Function）。
1.String
字符串（String）类型是一段以单引号''或双引号""包裹起来的文本，例如 '123'、"abc"。
定义字符串时，如果字符串中包含引号，可以使用反斜杠\来转义字符串中的引号，或者选择与字符串中不同的引号来定义字符串，如下例所示：
var str ="Let's have a cup of coffee."; // 双引号中包含单引号
var str = 'Hesaid "Hello" and left.'; // 单引号中包含双引号
var str ='We\'ll never give up.'; // 使用反斜杠转义字符串中的单引号
|
属性 | |
|
[table=98%]
|
| 方法 | |
| |
| |
| 检索字符串，获取给定字符串在字符串对象中首次出现的位置 |
| |
| 返回一个数字，并使用该数字来表示字符串对象是大于、小于还是等于给定字符串 |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
最常用的.length获取长度。
对字符处理：组合、替代、查找功能，在plc中也有相应的函数FIND/REPLACE/等。分享一个字符串完成的动态文字功能。
2.Number 类型
数值（Number）类型用来定义数值，JavaScript 中不区分整数和小数（浮点数），统一使用 Number 类型表示，如下例所示：
1. var num1 = 123; // 整数
2. var num2 = 3.14; // 浮点数
| 方法 | |
| 将字符串转换成浮点数，和全局方法 parseFloat() 作用相同 |
| 将字符串转换成整型数字，和全局方法 parseInt() 作用相同 |
| |
| |
| 判断 Number 对象是否为安全整数，即范围为 -(2⁵³ - 1)到 2⁵³ - 1 之间的整数 |
| 把 Number 对象转换为字符串，使用指定的基数 |
| |
3. Boolean 类型
布尔（Boolean）类型只有两个值，true（真）或者 false（假），在做条件判断时使用的比较多。
4.Undefined 类型
Undefined 也是一个只有一个值的特殊数据类型，表示未定义。当我们声明一个变量但未给变量赋值时，这个变量的默认值就是 Undefined。
5.Object 类型
JavaScript 中的对象（Object）类型是一组由键、值组成的无序集合，定义对象类型需要使用花括号{ }。在 JavaScript 中，对象类型的键都是字符串类型的，值则可以是任意数据类型。要获取对象中的某个值，可以使用对象名.键的形式，如下例所示：
var person = {
name: 'Bob',
age: 20,
tags: ['js', 'web', 'mobile'],
city: 'Beijing',
hasCar: true,
zipcode: null
};
6. Array 类型
数组（Array）是一组按顺序排列的数据的集合，数组中的每个值都称为元素，而且数组中可以包含任意类型的数据。在 JavaScript 中定义数组需要使用方括号[ ]，可以使用 Array() 函数来创建数组，如下例所示：
vararr = new Array(1, 2, 3, 4);
vararr = [1, 2, 3.14, 'Hello', null, true];
| 方法 | |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| 向数组的开头添加一个或多个元素，并返回新数组的长度 |
7.Math
Math 是 JavaScript 中的一个内置对象，其中提供了一些数学中常用的常量值和函数，用来实现一些数学中常见计算，例如计算平均数、求绝对值、四舍五入等。
var pi_val = Math.PI; // 数学中 π 的值：3.141592653589793
var abs_val = Math.sin(-5.35); //-5.35 的绝对值：5.35
| 属性 | |
| 返回算术常量 e，即自然对数的底数（约等于 2.718） |
| |
| |
| 返回以 2 为底的 e 的对数（约等于 1.443） |
| 返回以 10 为底的 e 的对数（约等于 0.434） |
| |
| 返回返回 2 的平方根的倒数（约等于 0.707） |
| |
三、循环
常见的循环除for、while、dowhile之外，JavaScript还包含了for in 和for of。
1.For in
for in 循环是一种特殊类型的循环，也是普通 for 循环的变体，主要用来遍历对象。
JS for in 循环示例代码：
// 定义一个对象
var person = {"name":"Clark", "surname": "Kent", "age":"36"};
// 遍历对象中的所有属性
for(var prop in person) {
……;
}
2.For of
for of与 forin 循环类似，也是普通 for 循环的一种变体。使用 for of 循环主要用来遍历数组。
示例代码如下：
//定义一个数组
vararr = ['a', 'b', 'c', 'd', 'e', 'f'];
//使用 for of 循环遍历数组中的每个元素
for(var value of arr) {
……;
}
四、定时器
1. setInterval()
JS setInterval() 函数可以定义一个能够重复执行的定时器，每次执行需要等待指定的时间间隔。语法格式如下：
setInterval(function, delay, [arg1, arg2,...]);
setInterval(code, delay);
2. clearTimeout
当使用 setTimeout() 或setInterval() 设置定时器时，这两个方法都会产生一个定时器的唯一 ID，ID 为一个正整数值，也被称为“定时器标识符”，通过这个 ID，我们可以清除 ID 所对应的定时器。
intervalID = setInterval(showTime, 1000);
clearInterval(intervalID);
五、画布canvas
js在<canvas>标签识别的画布上可以绘制图形，创建动画，设置设计实时视频处理或渲染。借助一套编程接口，用户可以在页面上绘制出漂亮的图形。
1.矩形
canvas提供了3种方法绘制矩形。
fillRect(x, y, width, height)：绘制一个填充的矩形。
strokeRect(x, y, width, height)：绘制一个矩形的边框。
clearRect(x, y, width, height)：清除指定矩形区域，让清除部分完全透明。
2.路径
beginPath()：开始路径。
closePath()：闭合路径。闭合路径之后图形绘制命令又重新指向上下文。
stroke()：描边路径。通过线条来绘制图形轮廓。
fill()：填充路径。通过填充路径的内容区域生成实心的图形,图形自动闭合。
3.圆弧
context.arc(x,y,r,sAngle,eAngle,counterclockwise);
4.画线
MoveTo(x,y);
lineTo(x,y);
5.样式和颜色
颜色-fillStyle和strokeStyle
不透明度-globalAlpha，rgba(R,G, B, A)
线的粗细-lineWidth
端点样式lineCap。包括三种：butt、round和square，默认为butt。
连接样式lineJoin。包括三种样式：round、bevel和miter，默认值为miter。
内容较多，建议收藏下载保存，帖子转成了word方便下载保存。
学习链接分享：
各种语言的学习教程，拿走不谢
IT7000关于画布的案例程序分享：
HMI官网版本：
