Intl.RelativeTimeFormat

    现在，浏览器提供内置的 Intl.RelativeTimeFormat API，可以不使用这些库，直接显示相对时间。

    是一个构造函数，接受一个语言代码作为参数，返回一个相对时间的实例对象。如果省略参数，则默认传入当前运行时的语言代码。

    下面是使用西班牙语显示相对时间的例子。

    1. const rtf = new Intl.RelativeTimeFormat('es');
    3. rtf.format(3.14, 'second') // "dentro de 3,14 segundos"
    4. rtf.format(-15, 'minute') // "hace 15 minutos"
    5. rtf.format(8, 'hour') // "dentro de 8 horas"
    6. rtf.format(-2, 'day') // "hace 2 días"
    7. rtf.format(3, 'week') // "dentro de 3 semanas"
    8. rtf.format(-5, 'month') // "hace 5 meses"
    9. rtf.format(2, 'quarter') // "dentro de 2 trimestres"
    10. rtf.format(-42, 'year') // "hace 42 años"

    Intl.RelativeTimeFormat()还可以接受一个配置对象，作为第二个参数，用来精确指定相对时间实例的行为。配置对象共有下面这些属性。

    • options.style：表示返回字符串的风格，可能的值有long（默认值，比如“in 1 month”）、short（比如“in 1 mo.”）、narrow（比如“in 1 mo.”）。对于一部分语言来说，narrow风格和short风格是类似的。
    • options.localeMatcher：表示匹配语言参数的算法，可能的值有（默认值）和lookup。
    • options.numeric：表示返回字符串是数字显示，还是文字显示，可能的值有always（默认值，总是文字显示）和auto（自动转换）。

    改变这个行为，可以把配置对象的numeric属性改成auto。

    2. rtf.format(-1, 'day') // "yesterday"
    3. rtf.format(0, 'day') // "today"
    4. rtf.format(1, 'day') // "tomorrow"
    5. rtf.format(-1, 'week') // "last week"
    6. rtf.format(0, 'week') // "this week"
    7. rtf.format(1, 'week') // "next week"

    相对时间实例对象的format方法，接受两个参数，依次为时间间隔的数值和单位。其中，“单位”是一个字符串，可以接受以下八个值。

    • year
    • quarter
    • month
    • week
    • day
    • hour
    • minute
    • second
    3. // "yesterday"
    4. rtf.formatToParts(-1, 'day');
    5. // [{ type: "literal", value: "yesterday" }]
    7. rtf.format(3, 'week');
    8. // "in 3 weeks"
    9. rtf.formatToParts(3, 'week');
    10. // [
    11. //   { type: 'literal', value: 'in ' },
    12. //   { type: 'integer', value: '3', unit: 'week' },
    13. //   { type: 'literal', value: ' weeks' }
    14. // ]

    返回数组的每个成员都是一个对象，拥有两个属性。

    • type：字符串，表示输出值的类型。
    • value：字符串，表示输出的内容。
    • unit：如果输出内容表示一个数值（即type属性不是literal），那么还会有属性，表示数值的单位。