`在某些场景下被特定组件替代),并引入了雄厚的数据绑定与逻辑控制能力。
数据绑定:使用双花括号`{{}}`将JavaScript中的数据动态渲染到视图层,如`{{userName}}`。这种声明式绑定使得视图与状态同步变得直观且高效。
列表渲染:通过`wx:for`指令,可以便捷地遍历数组生成列表项,极大简化了动态列表的构建。
条件渲染:`wx:if`、`wx:elif`、`wx:else`指令实现了根据条件显示或隐藏视图块,逻辑清晰。
模板与引用:WXML支持模板(``)定义与引用(``/``),促进了代码的复用与模块化。
WXSS(WeiXin Style Sheets) 绝大部分语法与CSS保持一致,降低了学习成本。其关键增强在于:
尺寸单位rpx:这是小程序的核心自适应方案。1rpx相当于屏幕宽度的1/750。无论设备屏幕宽度如何,以rpx定义的元素尺寸都能按比例缩放,实现了“一次设计,多端适配”的基础。
样式导入:使用`@import`语句可以导入外部样式文件,有利于样式管理。
局部样式:在组件对应的WXSS文件中定义的样式,默认仅在该组件内生效(通过添加独特属性选择器实现),有效避免了全局样式污染。
WXML与WXSS的组合,构成了小程序视图层的骨架与皮肤,它们通过数据绑定与逻辑层通信,专注于如何将数据美观、准确地呈现给用户。
二、逻辑层:JavaScript的增强与约束
小程序的逻辑层基于JavaScript(ES6+语法支持良好),但运行在一个独立的、沙箱化的环境中(早期为JSCore,现为V8等),与视图层(WebView)分离。这种分离带来了性能与安全上的好处,也引入了特定的API和生命周期概念。
App与Page构造器:小程序入口是`App`函数,用于注册小程序实例,定义全局生命周期和全局数据。每个页面则由`Page`函数注册,在其中定义页面的初始数据(`data`)、生命周期函数(如`onLoad`, `onShow`)、事件处理函数以及页面特有的方法。这是小程序逻辑组织的核心范式。
丰富的API:微信提供了覆盖网络请求(`wx.request`)、数据存储(`wx.setStorage`)、媒体操作(`wx.chooseImage`)、设备能力(`wx.getLocation`)等上百个API。这些API以`wx`对象上的方法形式提供,调用方式统一,大多返回Promise对象(同时也支持回调函数风格),便于异步编程。
模块化:支持CommonJS模块规范,允许开启者通过`require`和`module.exports`来组织和复用JavaScript代码,构建复杂的业务逻辑。
数据更新与通信:逻辑层通过调用`this.setData`方法,将数据变化同步到视图层。这是视图更新的仅此途径。`setData`是性能关键点,应避免频繁调用或传输过大的数据。
逻辑层的JavaScript虽然雄厚,但其运行环境与浏览器不同,没有`document`、`window`等BOM/DOM对象,也无法直接操作WXML节点(需通过特定API)。开启者需要适应这种“受控”的环境,专注于数据和业务逻辑。
三、配置文件:JSON的静态声明
JSON文件在小程序中承担了静态配置的角色,结构清晰,意图明确。
全局配置(app.json):这是小程序的蓝图,定义了页面路径列表(`pages`)、窗口表现(`window`)、网络超时、底部`tabBar`等全局性设置。`pages`数组的第一项即默认为首页。
页面配置(page.json):每个页面可以有自己的`.json`配置文件,用于覆盖`app.json`中`window`下的配置,定义该页面独有的导航栏标题、背景色等。
项目配置(project.config.json):用于定义项目的个性化设置,如开启者工具的项目详情、编译设置等,便于在不同设备间同步开发环境。
JSON配置采用声明式,将许多静态的、结构化的信息从代码中剥离,使应用的结构一目了然,也便于工具进行静态分析和处理。
四、组件化:内置与自定义的生态
小程序提供了丰富的基础组件,如`view`(视图容器)、`text`(文本)、`button`(按钮)、`input`(输入框)等。这些组件类似于HTML标签,但更具功能性和一致性,且自带微信的默认样式与交互体验。
更重要的是,小程序支持自定义组件。开启者可以创建自己的组件,拥有独立的WXML、WXSS、JS和JSON文件。自定义组件通过`Component`构造器注册,具有自己的数据、方法和生命周期,并通过属性(`properties`)和事件(`events`)与父组件通信。这是构建复杂、可复用前端界面的基础,推动了开发模式向真正的组件化、工程化演进。
微信小程序的开发语言体系,是一个以JavaScript为核心逻辑驱动,以WXML/WXSS为视图呈现手段,以JSON为静态配置声明,并辅以雄厚组件系统的有机整体。其设计哲学体现了“约束即自由”的思想:通过规范的语法、明确的职责分离和丰富的内置能力,限制开启者的随意性,从而大幅提升了在特定平台(微信)上开发轻量级应用的效率、一致性与性能。掌握这套语言,不仅仅是学习几种语法,更是理解其背后高效协作的架构思想,从而能在框定的路径上,走出蕞流畅的开发步伐。