Web开发编程网
分享Web开发相关技术

使用ListFormat在JavaScript中格式化语言敏感列表

使用Intl.ListFormat构造函数,我们可以轻松设置对语言敏感的列表的格式。它使我们可以设置列表格式的语言环境。另外,它还允许我们设置格式化列表的选项,例如列表的类型或列表的样式。要使用它,我们可以ListFormat使用Intl.ListFormat构造函数创建一个新对象。

构造函数最多需要两个参数。第一个参数是您要为其格式化列表的语言环境的字符串。第二个参数采用一个对象,该对象带有用于设置列表格式和样式的选项。Intl.ListFormat构造函数的一个示例用法是:

const arr = ['bus', 'car', 'train'];
const formatter = new Intl.ListFormat('en', {
  style: 'long',
  type: 'conjunction'
});
const formattedList = formatter.format(arr);
console.log(formattedList);

如果我们运行上面的代码中,我们将看到公交车轿车 火车从记录的console.log声明。该Intl.ListFormat构造函数创建一个具有格式化对象format根据语言环境和格式选项,我们设置为一个数组转换成列表的方法。

在上面的例子中,我们设置区域设置到en英语,我们设置了style属性long,该格式化的字符串数组成类似和CA,B,或C。该type属性指定我们要将列表格式化的列表类型。结合意味着我们格式化列表进入A,B和C

构造函数的参数是要将列表格式化的语言环境。它可以是一个字符串,也可以是包含要将其格式化为该列表的语言环境的字符串数组。一个或多个语言环境字符串应为BCP 47语言标记。该locales参数是可选的。BCP-47语言标签的简短列表包括:

ar — Arabic
bg — Bulgarian
ca — Catalan
zh-Hans — Chinese, Han (Simplified variant)
cs — Czech
da — Danish
de — German
el — Modern Greek (1453 and later)
en — English
es — Spanish
fi — Finnish
fr — French
he — Hebrew
hu — Hungarian
is — Icelandic
it — Italian
ja — Japanese
ko — Korean
nl — Dutch
no — Norwegian
pl — Polish
pt — Portuguese
rm — Romansh
ro — Romanian
ru — Russian
hr — Croatian
sk — Slovak
sq — Albanian
sv — Swedish
th — Thai
tr — Turkish
ur — Urdu
id — Indonesian

构造函数的第二个参数是一个对象,该对象使我们可以设置如何设置列表字符串的格式。有三个属性,这个对象:localeMatchertype,和style。该localeMatcher选项指定要使用的语言环境匹配算法。可能的值为lookupbest fit

lookup算法搜索语言环境,直到找到适合所比较字符串的字符集的语言环境为止。

best fit找到比lookup算法至少合适,但可能更合适的语言环境。

type属性可以取两个可能的值:conjunctiondisjunctionunitconjunction表示列表与相连,如A,B和C所示。这是默认选项。disnjunction装置列表接合用,如在A,B,或C

unit 代表具有单位的值列表。

style属性指定格式化消息的长度。此属性有两个可能的值。它可以是long(例如A,B和C),short(例如A,B,C)或narrow(例如ABC)。当styleshort或时narrowunit是此选项唯一允许的值。

例如,我们可以使用它来将列表格式化为以and结尾的字符串。我们可以这样写:

const arr = ['bus', 'car', 'bicycle'];
const formatter = new Intl.ListFormat('en', {
  style: 'long',
  type: 'conjunction'
});
const formattedList = formatter.format(arr);
console.log(formattedList);

如果我们formattedList像上面那样记录常数,就可以得到公共汽车,汽车和自行车。我们将en语言环境设置为使用style long和作为连词来设置英语语言环境的字符串格式,这意味着该列表将以and结尾。如果要获取基于列表列表,可以将type属性更改为disjunction,如以下代码所示:

const arr = ['bus', 'car', 'bicycle'];
const formatter = new Intl.ListFormat('en', {
  style: 'long',
  type: 'disjunction'
});
const formattedList = formatter.format(arr);
console.log(formattedList);

如果运行上面的代码,则上面的语句中将记录公共汽车,汽车或自行车console.log

我们可以使用属性的shortnarrow选项将其转换为较短的列表style。例如,我们可以这样写:

const arr = ['bus', 'car', 'bicycle'];
const formatter = new Intl.ListFormat('en', {
  style: 'short',
  type: 'conjunction'
});
const formattedList = formatter.format(arr);
console.log(formattedList);

然后console.log当我们运行上面的代码时,我们在输出中获得公交车,汽车和自行车。的shortdisjunction组合是一样的longdisjunction组合。如果我们写:

const arr = ['bus', 'car', 'bicycle'];
const formatter = new Intl.ListFormat('en', {
  style: 'short',
  type: 'disjunction'
});
const formattedList = formatter.format(arr);
console.log(formattedList);

然后我们乘公共汽车,汽车或自行车。该narrow选项将使其更短。例如,如果我们输入:

const arr = ['bus', 'car', 'bicycle'];
const formatter = new Intl.ListFormat('en', {
  style: 'narrow',
  type: 'conjunction'
});
const formattedList = formatter.format(arr);
console.log(formattedList);

然后console.log当我们运行上述代码时我们将公共汽车,汽车,自行车登录了。

这也适用于非英语语言环境。例如,如果要将中文字符串列表格式化为列表,可以编写以下代码:

const arr = ['', '', ''];
const formatter = new Intl.ListFormat('zh-hant', {
  style: 'narrow',
  type: 'conjunction'
});
const formattedList = formatter.format(arr);
console.log(formattedList);

然后我们得到“日,月和星”,意思是太阳,月亮和星星。如果将style选项切换为longshort,则会得到相同的结果,因为与英语不同,中文只有一种写连词的方式。disjunction也适用于中文。例如,如果我们有:

const arr = ['', '', ''];
const formatter = new Intl.ListFormat('zh-hant', {
  style: 'long',
  type: 'disjunction'
});
const formattedList = formatter.format(arr);
console.log(formattedList);

然后我们得到“日,月或星”,表示太阳,月亮或星星。如果将style选项切换为longshort,就像使用中文连词一样,我们会得到相同的结果,因为用中文只有一种书写分离词的方法,这与英语不同。


formatToParts()方法

除了该format方法之外,Intl.ListFormat实例还具有formatToParts方法,该方法将数组格式化为连接或分离字符串,然后将其作为格式化字符串部分的数组返回。

例如,如果我们要为列表返回格式化的英语字符串部分的数组,则可以编写以下代码:

const arr = ['bus', 'car', 'bicycle'];
const formatter = new Intl.ListFormat('en', {
  style: 'long',
  type: 'conjunction'
});
const formattedList = formatter.formatToParts(arr);
console.log(formattedList);

然后我们得到:

[
  {
    "type": "element",
    "value": "bus"
  },
  {
    "type": "literal",
    "value": ", "
  },
  {
    "type": "element",
    "value": "car"
  },
  {
    "type": "literal",
    "value": ", and "
  },
  {
    "type": "element",
    "value": "bicycle"
  }
]

console.log声明中。这些是我们通过该format方法获得的格式化字符串的各个部分,但分为多个单独的条目。如果只需要格式化字符串的某些部分,则此方法很方便。


使用Intl.ListFormat构造函数,可以轻松设置语言敏感列表的格式。构造函数将区域设置字符串或区域设置字符串数组作为第一个参数,并将带有某些选项的对象作为第二个参数。我们可以将数组转换为字符串,并使用Intl.ListFormat实例的format方法将列表格式化为连接词或析取词,该方法采用语言环境字符串和格式字符串长度样式的选项,以及它是连接词,析取词还是单位串。它还有一种formatToParts方法可以将其转换为格式化列表,然后将各个部分分解为一个数组。

未经允许不得转载:WEB开发编程网 » 使用ListFormat在JavaScript中格式化语言敏感列表
微信扫码关注微信公众号

WEB开发编程网

谢谢支持,我们一直在努力

安全提示:您正在对WEB开发编程网进行赞赏操作,一但支付,不可返还。