正文

Math, Functions, and Expressions

数学、函数和表达式

Expressions allow you to dynamically generate text and numeric values through interactions in your prototypes. You can use expressions to do things like calculate the purchase total for a shopping cart, dynamically construct UI messages, and display the current date.

表达式允许您通过原型中的交互动态生成文本和数值。可以使用表达式来计算购物车的购买总额、动态构造UI消息和显示当前日期。

You can use an expression in any field that has an fx icon next to it. Type your expression directly into the field or click the icon to open the Edit Value dialog. From there, you can click Insert Variable or Function to view the full list of variables and functions available for use in expressions. You can also create local variables to access specific widget properties in your expressions.

您可以在任何具有 fx 图标的字段中使用表达式。直接在字段中键入表达式或单击图标打开 编辑值 对话框。在这里，您可以单击 插入变量或函数 ，以查看表达式中可用的变量和函数的完整列表。您还可以创建本地变量来访问表达式中的特定小部件属性。

1、Writing Expressions

写表达式

Axure RP treats any text wrapped in double square brackets as an expression, and the expression itself will be replaced by its own final output value in the web browser. Text outside the brackets is treated as static and will not be changed in the web browser.

Axure RP将任何包装在双方括号中的文本视为表达式，表达式本身将被其在web浏览器中的最终输出值替换。方括号外的文本被视为静态文本，不会在web浏览器中更改。

For example, if you set the text on a widget to Your total is $[[ 5.50 + 2.99 ]] , the widget's text will read Your total is $8.49 in the web browser.

例如，如果您将小部件上的文本设置为“Your total is 8.49”。

2、Numbers and Math

数字和数学

2.1、Basic Operators

基本操作

You can perform the following basic math operations in your expressions:
你可以在你的表达式中执行以下基本的数学运算:

2.1.1、Addition: +

加法 ：+

[[ 5 + 2 ]] -> 7

2.1.2、Subtraction: -

减法： -

[[ 5 - 2 ]] -> 3

2.1.3、Multiplication: *

乘法： *

[[ 5 * 2 ]] -> 10

2.1.4、Division: /

除法： /

[[ 5 / 2 ]] -> 2.5

2.1.5、Modulus/Remainder: %

余/模数运算符 ： %

[[ 5 % 2 ]] -> 1

2.2、Advanced Number and Math Functions

高级数字和数学函数

To perform more advanced mathematical operations, use the functions listed under Number and Math in the Insert Variable or Function menu.

要执行更高级的数学操作，请使用 Insert变量或函数 菜单中 Number 和 Math 下列出的函数。

You can use these functions with:
你可以使用这些函数:

• numbers:
  数字：

[[ 7.546.toFixed(2) ]]

• variables containing numeric values:
  变量包含数值:

[[ TaxRateVar.toFixed(2) ]]

• numeric values returned by other operations and functions:
  其他操作和函数返回的数值:

[[ (2.55*7.3).toFixed(2) ]]

2.2.1、 x .toExponential(decimalPoints)

Returns a string representing x in exponential notation. You can specify the number of decimal places in the parentheses.
以指数形式返回一个表示x的字符串。可以在括号中指定小数位数。

[[ 12345.toExponential() ]] -> 1.2345e+4
[[ 12345.toExponential(2) ]] -> 1.23e+4

2.2.2、 x .toFixed(decimalPoints)

Rounds x to the number of decimal places specified in the parentheses.
将x四舍五入为圆括号中指定的小数位数。

[[ 12.345.toFixed(2) ]] -> 12.35

2.2.3、 x .toPrecision(length)

Returns a string representing x with the specified number of significant digits. May return in exponential notation for large numbers.
返回一个表示x的字符串，该字符串具有指定的有效位数。对于较大的数字可以用指数表示。

[[ 12.34.toPrecision(3) ]] -> 12.3
[[ 12.34.toPrecision(5) ]] -> 12.340
[[ 1234.toPrecision(2) ]] -> 1.2e+3

2.2.4、Math.abs( x )

Returns the absolute value of x.
返回x的绝对值。

[[ Math.abs(1) ]] -> 1
[[ Math.abs(-1) ]] -> 1

2.2.5、Math.acos( x )

Returns the arccosine of x in radians.
以弧度为单位返回x的反余弦。

[[ Math.acos(-1) ]] -> 3.141592653589793
[[ Math.acos(0) ]] -> 1.5707963267948966
[[ Math.acos(1) ]] -> 0

2.2.6、Math.asin( x )

Returns the arcsine of x in radians.
返回以弧度为单位的arcsin (x)

[[ Math.asin(-1) ]] -> -1.5707963267948966
[[ Math.asin(0) ]] -> 0
[[ Math.asin(1) ]] -> 1.5707963267948966

2.2.7、Math.atan( x )

Returns the arctangent of x in radians.
返回以弧度为单位的arctan(x)。

[[ Math.atan(1) ]] -> 0.7853981633974483
[[ Math.atan(0) ]] -> 0
[[ Math.atan(-0) ]] -> -0

2.2.8、Math.atan2( y , x )

Returns the angle in the plane (in radians) between the positive x-axis and the ray from (0,0) to the point (x,y).
返回从(0,0)到(x,y)点的正x轴和射线在平面上的角度(以弧度为单位)。

[[ Math.atan2(90, 15) ]] -> 1.4056476493802699
[[ Math.atan2(15, 90) ]] -> 0.16514867741462683

2.2.9、Math.ceil( x )

Rounds x up to the nearest integer.
把x四舍五入到最接近的整数。

[[ Math.ceil(12.7) ]] -> 13
[[ Math.ceil(12.3) ]] -> 13

2.2.10、Math.cos( x )

Returns the cosine of x, which must be expressed in radians.
返回cosx，它必须用弧度表示。

[[ Math.cos(0) ]] -> 1
[[ Math.cos(1) ]] -> 0.5403023058681398

2.2.11、Math.exp( x )

Returns e raised to the power of x, where e is Euler's number.
返回e的x次方，其中e是欧拉数。

[[ Math.exp(0) ]] -> 1
[[ Math.exp(1) ]] -> 2.718281828459045

2.2.12、Math.floor( x )

Rounds x down to the nearest integer.
把x四舍五入到最接近的整数。

[[ Math.floor(12.7) ]] -> 12
[[ Math.floor(12.3) ]] -> 12

2.2.13、Math.log( x )

Returns the natural logarithm of x.
返回x的自然对数。

[[ Math.log(1) ]] -> 0
[[ Math.log(10) ]] -> 2.302585092994046

2.2.14、Math.max( x , y , ...)

Returns the largest of the numbers in the parentheses.
返回括号中最大的数字。

[[ Math.max(1, 2, 3) ]] -> 3

2.2.15、Math.min( x , y , ...)

Returns the smallest of the numbers in the parentheses.
返回括号中最小的数字。

[[ Math.min(1, 2, 3) ]] -> 1

2.2.16、Math.pow( x , y )

Returns x raised to the power of y.
返回x的y次方。

[[ Math.pow(5, 2) ]] -> 25

2.2.17、Math.random()

Returns a random number between 0 (inclusive) and 1 (exclusive).
返回0(包含)和1(排除)的随机数。

[[ Math.random() ]] -> 0.9255151869426522
[[ Math.random() ]] -> 0.313352887182183

Tip
提示

Check out the Mozilla Developer Network reference on Math.random( to learn how to generate random numbers within your own specified range.
查看Mozilla开发者网络的数学参考。学习如何在指定范围内产生随机数。

2.2.18、Math.sin( x )

Returns the sine of x, which must be expressed in radians.
返回sin x,这必须用弧度表示。

[[ Math.sin(0) ]] -> 0
[[ Math.sin(1) ]] -> 0.8414709848078965

2.2.19、Math.sqrt( x )

Returns the square root of x.
返回x的平方根。

[[ Math.sqrt(25) ]] -> 5

2.2.20、Math.tan( x )

Returns the tangent of x, which must be expressed in radians.
返回tanx，它必须用弧度表示。

[[ Math.tan(0) ]] -> 0
[[ Math.tan(1) ]] -> 1.5574077246549023

3、String (Text)

字符串（文本）

To manipulate strings of text, use the functions listed under String in the Insert Variable or Function menu.
要操作文本字符串，请使用 Insert变量或函数 菜单中 String 下列出的函数。

You can use these functions with:
你可以使用这些函数:

• strings of text inside double or single quotation marks:
  双引号或单引号内的文本字符串:

    [[ "Hello, world!".toUpperCase() ]]

• variables containing string values:
  包含字符串值的变量:

[[ GreetingVar.toUpperCase() ]]

• string values returned by other operations and functions:
  其他操作和功能返回的字符串值:

[[ "Hello, world!".substr(0,5).toUpperCase() ]]

3.0.1、 string .length

Returns the character length of the string, including spaces.

返回字符串的字符长度，包括空格。

[[ "Hello, world!".length ]] -> 13

3.0.2、 string .charAt(index)

Returns the character at the specified index in the string.

返回字符串中指定索引处的字符。

[[ "Hello, world!".charAt(7) ]] -> w

3.0.3、 string .charCodeAt(index)

Returns the UTF-16 code unit of the character at the specified index in the string.

返回字符串中指定索引处字符的UTF-16代码单元。

[[ "Hello, world!".charCodeAt(7) ]] -> 119

3.0.4、 string .concat("string", ...)

Adds ( concat enates) the string(s) in the parentheses to the string the function is called on.

将圆括号中的字符串添加到函数所调用的字符串中。

[[ "Hello".concat(", world!") ]] -> Hello, world!

Tip
提示

You can also concatenate strings with the addition operator, + :
您还可以连接字符串与加法运算符，' + ':
[[ "Hello" + ", world!" ]] -> Hello, world!

3.0.5、 string .indexOf("searchValue")

Returns the starting index of the first instance of the search value within the string the function is called on. If the search value isn't found, returns -1.

返回调用该函数的字符串中的搜索值的 第一个实例 的起始索引。如果没有找到搜索值，则返回-1。

[[ "Hello, world!".indexOf("o") ]] -> 4
[[ "Hello, world!".indexOf("Howdy") ]] -> -1

3.0.6、 string .lastIndexOf("searchValue")

Returns the starting index of the last instance of the search value within the string the function is called on. If the search value isn't found, returns -1.

返回调用该函数的字符串中的搜索值的 最后一个实例 的起始索引。如果没有找到搜索值，则返回-1。

[[ "Hello, world!".lastIndexOf("o") ]] -> 8
[[ "Hello, world!".lastIndexOf("Howdy") ]] -> -1

3.0.7、 string .replace("searchValue", "newValue")

Replaces all instances of the search value with the new value.

用新值替换搜索值的所有实例。

[[ "Hello, world!".replace("Hello", "Howdy") ]] -> Howdy, world!

3.0.8、 string .slice(startIndex, endIndex)

Returns a snippet of the string, starting with the character at the first index and ending with the character just before the second index. You can optionally omit the second index to instead end at the end of the string.

返回字符串片段，从第一个索引处的字符开始，以第二个索引处的字符**结束。您可以选择省略第二个索引，而将其放在字符串的末尾。

You may provide negative indices to count backwards from the end of the string, as in the third example below.

You may provide negative indices to count backwards from the end of the string, as in the third example below.

[[ "Hello, world!".slice(3, 10) ]] -> lo, wor
[[ "Hello, world!".slice(3) ]] -> lo, world!
[[ "Hello, world!".slice(-6, 12) ]] -> world

3.0.9、 string .substr(startIndex, length)

Returns a snippet of the string, starting with the character at the starting index and continuing until the specified length is reached. You can optionally omit the length to instead end at the end of the string.

返回字符串片段，从起始索引处的字符开始，直到达到指定长度为止。您可以选择省略字符串末尾的长度。

You may provide negative indices to count backwards from the end of the string, as in the third example below.

您可以提供负索引来从字符串的末尾向后计数，如下面的第三个示例所示。

[[ "Hello, world!".substr(3, 7) ]] -> lo, wor
[[ "Hello, world!".substr(3) ]] -> lo, world!
[[ "Hello, world!".substr(-6, 5) ]] -> world

3.0.10、 string .substring(startIndex, endIndex)

Returns a snippet of the string, starting with the character at the first index and ending with the character just before the second index. You can optionally omit the second index to instead end at the end of the string.

返回字符串片段，从第一个索引处的字符开始，以第二个索引处的字符**结束。您可以选择省略第二个索引，而将其放在字符串的末尾。

[[ "Hello, world!".substring(3, 10) ]] -> lo, wor
[[ "Hello, world!".substring(3) ]] -> lo, world!

Note
提示

The substring() method does not support negative indices.
' substring() '方法不支持负索引。

3.0.11、 string .toLowerCase()

Converts the string to all lowercase characters.

将字符串转换为所有小写字符。

[[ "Hello, world!".toLowerCase() ]] -> hello, world!

3.0.12、 string .toUpperCase()

Converts the string to all uppercase characters.
将字符串转换为所有大写字符。

[[ "Hello, world!".toUpperCase() ]] -> HELLO, WORLD!

3.0.13、 string .trim()

Removes all space characters from the beginning and end of the string.

删除字符串开头和结尾的所有空格字符。

[[ "   Hello, world!   ".trim() ]] -> Hello, world

4、Widget Properties

部件属性

You can access the properties of widgets, like their location and dimensions, with the options listed under Widget in the Insert Variable or Function menu.

您可以使用 Insert变量或函数 菜单中的 Widget 下列出的选项来访问小部件的属性，比如它们的位置和维数。

In order to use these options, you'll need to append them to a widget object with "dot notation": Object.property . There are three widget objects you can use:

为了使用这些选项，您需要使用“点表示法”将它们附加到小部件对象:“object .property”。有三个小部件对象，你可以使用:

• This refers to the widget whose event you're configuring the current action under, such as a button whose Click or Tap event you might be working with.
  This 指的是您正在配置当前操作的小部件，例如您可能正在使用的按钮的 Click或Tap 事件。

[[ This.width ]]

• Target refers to the widget that is the target of the action you're currently configuring, such as the widget being hidden with a Show/Hide action.
  Target 指的是您当前正在配置的操作的目标小部件，例如使用 Show/Hide 操作隐藏的小部件。

[[ Target.width ]]

• LVAR1 refers to a widget you've stored in a local variable. (Replace "LVAR1" with whatever name you've assigned your local variable.)
  LVAR1 引用您存储在局部变量中的小部件。(将“LVAR1”替换为您已分配给局部变量的任何名称。)

[[ LVAR1.width ]]

4.0.1、 widget .x

Returns the x value of the widget's top-left corner.

返回小部件左上角的x值。

[[ LVAR1.x ]] -> 100

4.0.2、 widget .y

Returns the y value of the widget's top-left corner.

返回小部件左上角的y值。

[[ LVAR1.y ]] -> 100

4.0.3、 widget .width

Returns the widget's width in pixels.

返回小部件的宽度(以像素为单位)。

[[ LVAR1.width ]] -> 300

4.0.4、 widget .height

Returns the widget's height in pixels.

返回小部件的高度(以像素为单位)。

[[ LVAR1.height ]] -> 170

4.0.5、 widget .scrollX

Returns the number of pixels that a scrollable dynamic panel has been scrolled horizontally.

返回可滚动动态面板水平滚动的像素数。

[[ LVAR1.scrollX ]] -> 50

4.0.6、 widget .scrollY

Returns the number of pixels that a scrollable dynamic panel has been scrolled vertically.

返回可滚动动态面板垂直滚动的像素数。

[[ LVAR1.scrollY ]] -> 50

4.0.7、 widget .text

Returns the widget's text, if any.

返回小部件的文本(如果有的话)。

[[ LVAR1.text ]] -> [email protected]

4.0.8、 widget .name

Returns the widget's name, if you've given it one.

返回小部件的名称(如果您已经给了它)。

[[ LVAR1.name ]] -> Email Field

4.0.9、 widget .top

Returns the y value of the widget's top edge.

返回小部件顶部边缘的y值。

[[ LVAR1.top ]] -> 100

4.0.10、 widget .left

Returns the x value of the widget's left edge.

返回小部件左边缘的x值。

[[ LVAR1.left ]] -> 100

4.0.11、 widget .right

Returns the x value of the widget's right edge.

返回小部件右边缘的x值。

[[ LVAR1.right ]] -> 400

4.0.12、 widget .bottom

Returns the y value of the widget's bottom edge.

返回小部件底部边缘的y值。

[[ LVAR1.bottom ]] -> 270

4.0.13、 widget .opacity

Returns the widget's opacity as a number between 0 and 100.

将小部件的不透明度返回到0到100之间。

[[ LVAR1.opacity ]] -> 85

4.0.14、 widget .rotation

Returns the widget's rotation as a number between 0 and 359.

以0到359之间的数字返回小部件的旋转。

[[ LVAR1.rotation ]] -> 90

5、Page, Window, and Cursor

页面、窗口和光标

5.0.1、PageName

Returns the name of the current page, as shown in the Pages pane.

返回当前页的名称，如 Pages 窗格中所示。

[[ PageName ]] -> Login Page

5.0.2、Window.width

Returns the width of the browser window's viewport in pixels.

返回浏览器窗口的窗口宽度(以像素为单位)。

[[ Window.width ]] -> 1920

5.0.3、Window.height

Returns the height of the browser window's viewport in pixels.

返回浏览器窗口的窗口高度(以像素为单位)。

[[ Window.height ]] -> 948

5.0.4、Window.scrollX

Returns the number of pixels that the browser window has been scrolled horizontally.

返回浏览器窗口水平滚动的像素数。

[[ Window.scrollX ]] -> 100

5.0.5、Window.scrollY

Returns the number of pixels that the browser window has been scrolled vertically.

返回浏览器窗口垂直滚动的像素数。

[[ Window.scrollY ]] -> 100

5.0.6、Cursor.x

Returns the x value of the cursor's position on the page.

返回光标在页面上的位置的x值。

[[ Cursor.x ]] -> 100

5.0.7、Cursor.y

Returns the y value of the cursor's position on the page.

返回游标在页面上的位置的y值。

[[ Cursor.y ]] -> 100

5.0.8、DragX

Returns the pixel difference between the cursor's previous and current position along the X axis as you're dragging a dynamic panel widget. The value is positive when you're dragging to the right and negative when you're dragging to the left.

在拖动动态面板小部件时，返回光标在X轴上的先前位置和当前位置之间的像素差。当你向右拖动时，值为正，当你向左拖动时，值为负。

[[ DragX ]] -> 3
[[ DragX ]] -> -5

5.0.9、DragY

Returns the pixel difference between the cursor's previous and current position along the Y axis as you're dragging a dynamic panel widget. The value is positive when you're dragging down and negative when you're dragging up.

在拖动动态面板小部件时，返回光标在Y轴上的先前位置和当前位置之间的像素差。向下拖动时，值为正向上拖动时，值为负。

[[ DragY ]] -> 3
[[ DragY ]] -> -5

5.0.8、TotalDragX

Returns the pixel difference between the cursor's starting position and its current position along the X axis as you're dragging a dynamic panel widget. The value is positive when you're dragging to the right and negative when you're dragging to the left.

在拖动动态面板小部件时，返回光标的起始位置和当前位置沿X轴的像素差。当你向右拖动时，值为正，当你向左拖动时，值为负。

[[ TotalDragX ]] -> 30
[[ TotalDragX ]] -> -50

5.0.9、TotalDragY

Returns the pixel difference between the cursor's starting position and its current position along the Y axis as you're dragging a dynamic panel widget. The value is positive when you're dragging down and negative when you're dragging up.

在拖动动态面板小部件时，返回光标的起始位置与当前位置之间的像素差。向下拖动时，值为正向上拖动时，值为负。

[[ TotalDragY ]] -> 30
[[ TotalDragY ]] -> -50

5.0.10、DragTime

Returns the total time in milliseconds that a draggable dynamic panel has been dragged from drag start to drag drop.

返回可拖动的动态面板从拖动开始拖放到拖放之间的总时间(以毫秒为单位)。

[[ DragTime ]] -> 1525

Note
提示

Though DragTime tracks the duration of the entire drag, the return value is only updated when the cursor moves during the drag.

虽然“DragTime”跟踪整个拖动的持续时间，但只有当鼠标在拖动过程中移动时才会更新返回值。

6、Date and Time

日期和时间

Use the functions listed under Date in the Insert Variable or Function menu to produce and manipulate date and time information.

使用 Insert变量或函数 菜单中 Date 下列出的函数来生成和操作日期和时间信息。

You can use these functions with the following date objects:
您可以使用下列日期对象:

• Now
• GenDate
• Date.UTC()
• Date.parse()

6.0.1、Now

A date object representing the current date and time. When used by itself, returns the current date and time, fully articulated and with the web browser's time zone.

表示当前日期和时间的日期对象。当它自己使用时，返回当前的日期和时间，完全连接并带有web浏览器的时区。

[[ Now ]] -> Wed Nov 14 2018 16:20:24 GMT-0800 (Pacific Standard Time)

6.0.2、GenDate

A date object representing the date and time that the prototype's HTML was last generated. When used by itself, returns the generation date and time, fully articulated and with the web browser's time zone.

一个日期对象，表示原型的HTML最后一次生成的日期和时间。当它自己使用时，将返回生成日期和时间，并与web浏览器的时区完全关联。

[[ GenDate ]] -> Wed Nov 14 2018 16:20:24 GMT-0800 (Pacific Standard Time)

6.0.3、Now.getDate() and Now.getUTCDate()

Returns a number representing the given date object's day of the month, either in the web browser's time zone or Coordinated Universal Time (UTC).

在web浏览器的时区或协调世界时(UTC)中返回一个数字，该数字表示给定的日期对象的月份的日期。

[[ Now.getDate() ]] -> 14
[[ Now.getUTCDate() ]] -> 15

6.0.4、Now.getDay() and Now.getUTCDay()

Returns a number representing the given date object's day of the week, either in the web browser's time zone or Coordinated Universal Time (UTC). Sunday is 0, and Saturday is 6.

在web浏览器的时区或协调世界时(UTC)中返回表示给定日期对象的星期几的数字。星期天是0，星期六是6。

[[ Now.getDay() ]] -> 3
[[ Now.getUTCDay() ]] -> 4

6.0.5、Now.getDayOfWeek()

Returns the name of the given date object's day of the week.
返回给定日期对象日的名称。

[[ Now.getDayOfWeek() ]] -> Wednesday

6.0.6、Now.getFullYear() and Now.getUTCFullYear()

Returns the given date object's year in four-digit format, either in the web browser's time zone or Coordinated Universal Time (UTC).

在web浏览器的时区或协调世界时,以四位数的格式返回给定的日期对象。

[[ Now.getFullYear() ]] -> 2018
[[ Now.getUTCFullYear() ]] -> 2018

6.0.7、Now.getHours() and Now.getUTCHours()

Returns the hours portion of the given date object's time as a number between 0 and 23 (24 hour/military format), either in the web browser's time zone or Coordinated Universal Time (UTC).

返回给定日期对象的时间部分,作为一个数字在0到23(24小时/军用格式),要么在web浏览器的时区或协调的世界时(UTC)。

[[ Now.getHours() ]] -> 16
[[ Now.getUTCHours() ]] -> 0

6.0.8、Now.getMilliseconds() and Now.getUTCMilliseconds()

Returns the milliseconds portion of the given date object's time, either in the web browser's time zone or Coordinated Universal Time (UTC).

返回给定日期对象时间的毫秒部分,无论是在web浏览器的时区还是协调世界时(UTC)。

[[ Now.getMilliseconds() ]] -> 838
[[ Now.getUTCMilliseconds() ]] -> 838

6.0.9、Now.getMinutes() and Now.getUTCMinutes()

Returns the minutes portion of the given date object's time, either in the web browser's time zone or Coordinated Universal Time (UTC).

返回给定日期对象时间的分钟部分,无论是在web浏览器的时区还是协调世界时(UTC)。

[[ Now.getMinutes() ]] -> 20
[[ Now.getUTCMinutes() ]] -> 20

6.0.10、Now.getMonth() and Now.getUTCMonth()

Now.getMonth() returns the given date object's month as a number between 1 and 12 in the web browser's time zone.
' Now.getMonth() '在web浏览器的时区中以1到12之间的数字返回给定日期对象的月份。

Now.getUTCMonth() returns the given date object's month as a number between 0 and 11 in Coordinated Universal Time (UTC).
Now.getUTCMonth() 返回给定日期对象的月,作为协调世界时(UTC)之间的0到11之间的数字。

[[ Now.getMonth() ]] -> 11
[[ Now.getUTCMonth() ]] -> 10

6.0.11、Now.getMonthName()

Returns the name of the given date object's month.
返回给定日期对象的月的名称。

[[ Now.getMonthName() ]] -> November

6.0.12、Now.getSeconds() and Now.getUTCSeconds()

Returns the seconds portion of the given date object's time, either in the web browser's time zone or Coordinated Universal Time (UTC).

请到「今天看啥」查看全文