写出你的第一个手环脚本

从打印一句话开始，做一个能点击的计数器。

云空间JS 市场

内置 AI 同款提示词

将 Markdown 发给其他 AI，生成 JSLab 脚本。

下载 .md

写出你的第一个手环脚本

这篇教程会带你做一个计数器：点一下按钮，屏幕上的数字就加一。先从打印一行文字开始，熟悉怎样编辑、运行和保存脚本。

新建文件，打印一句话

在手环上打开 JSLab，进入工作区，选择新建文件，取名 hello.js。在编辑器里输入：

console.log('你好，JSLab！');

点击运行，你会在日志页看到“你好，JSLab！”。试着把引号里的文字换成自己的名字，再运行一次。

console.log() 把括号里的内容显示在日志中。文字要用引号包起来，末尾的分号表示这句代码结束了。

运行用的是编辑器里当前的代码。返回编辑器后记得点击保存，这样下次打开文件时才能继续使用。

在屏幕上显示文字

把文件里的代码换成下面这一段：

ui.render([
  ui.heading('我的第一个程序'),
  ui.text('这段文字显示在手环屏幕上。')
]);

再次运行，屏幕会显示一个标题和一段文字。

这里的 ui.heading() 创建标题，ui.text() 创建正文。把它们放进方括号，再交给 ui.render()，就能从上到下显示出来。

在界面中按返回，会回到日志页；轻点日志内容，就能恢复刚才的界面。再从日志页返回，才会离开这次运行。

加上一个可以点击的按钮

接下来把代码换成一个计数器：

const count = ui.signal(0);

ui.render(() => [
  ui.heading('计数器'),
  ui.text('已经点了 ' + count.get() + ' 次'),
  ui.button('加一', () => {
    count.update(value => value + 1);
  })
]);

运行后，每点一次“加一”，数字就会增加。返回日志页再恢复界面，数字也会保留；点击右上角的重载按钮，程序重新开始，数字回到 0。

这段代码可以分成三步看：

  1. ui.signal(0) 记住一个可以变化的值，初始值是 0。
  2. count.get() 读出当前数字，用它拼出屏幕上的文字。
  3. 点击按钮时，count.update() 在原来的数字上加一，并更新界面。

ui.render() 后面的 () => [...] 是一个函数。数字变化时，JSLab 会再次调用它，得到更新后的显示内容。

试着改一改

把初始值改成 10，或者把按钮文字改成“加二”、把 value + 1 改成 value + 2。每次修改后运行，看看结果是否和预想的一样。

如果没有运行成功，先读日志中的错误提示，再检查引号、括号和逗号是否成对。程序一直没有响应时，也要检查是否写出了不会结束的循环。

接下来学什么