From 867a9aae2b7e54eca0099c6f5d103d0ef171f6f4 Mon Sep 17 00:00:00 2001 From: Kevin CHEN <33132228+KevinZonda@users.noreply.github.com> Date: Wed, 18 Aug 2021 15:38:14 +0100 Subject: Fix syntax highlight Web/JavaScript/Reference/Statements/import, zh-CN (#2110) * optimise Statements/import * http -> https * remove code tag in pre --- .../javascript/reference/statements/import/index.html | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) (limited to 'files/zh-cn/web/javascript') diff --git a/files/zh-cn/web/javascript/reference/statements/import/index.html b/files/zh-cn/web/javascript/reference/statements/import/index.html index b7634d9cef..203ce9b8cc 100644 --- a/files/zh-cn/web/javascript/reference/statements/import/index.html +++ b/files/zh-cn/web/javascript/reference/statements/import/index.html @@ -21,7 +21,7 @@ translation_of: Web/JavaScript/Reference/Statements/import
语法
-import defaultExport from "module-name"; +import defaultExport from "module-name"; import * as name from "module-name"; import { export } from "module-name"; import { export as alias } from "module-name"; @@ -95,7 +95,7 @@ var promise = import("module-name");//这是一个处于第三阶段的提案。-整个模块仅为副作用(中性词,无贬义含义)而导入,而不导入模块中的任何内容(接口)。 这将运行模块中的全局代码, 但实际上不导入任何值。
-+import '/modules/my-module.js';
import '/modules/my-module.js';导入默认值
@@ -116,9 +116,9 @@ var promise = import("module-name");//这是一个处于第三阶段的提案。 // specific, named importsWhen importing a default export with {{anch("Dynamic Imports", "dynamic imports")}}, it works a bit differently. You need to destructure and rename the "default" key from the returned object.
+当用{{anch("动态导入")}}的方式导入默认导出时,其工作方式有所不同。你需要从返回的对象中解构并重命名 "default" 键。
-(async () => { +(async () => { if (somethingIsTrue) { const { default: myDefault, foo, bar } = await import('/modules/my-module.js'); } @@ -140,15 +140,15 @@ var promise = import("module-name");//这是一个处于第三阶段的提案。关键字import可以像调用函数一样来动态的导入模块。以这种方式调用,将返回一个
-promise
。import('/modules/my-module.js') +
+ });import('/modules/my-module.js') .then((module) => { // Do something with the module. - });这种使用方式也支持
-await
关键字。+let module = await import('/modules/my-module.js');
let module = await import('/modules/my-module.js');示例
@@ -227,6 +227,6 @@ for (const link of document.querySelectorAll("nav > a")) {
function counter() { for (var count = 1; ; count++) { // 无限循环 console.log(count + "A"); // 执行5次 - if (count === 5) { - return; - } - console.log(count + "B"); // 执行4次 + if (count === 5) { + return; } + console.log(count + "B"); // 执行4次 + } console.log(count + "C"); // 永远不会执行 } -- cgit v1.2.3-54-g00ecf From b5bdd6a4fdbc96ec4574acbc93aa426714826320 Mon Sep 17 00:00:00 2001 From: PercyDate: Thu, 19 Aug 2021 22:36:24 +0800 Subject: Use ^ instead of the tag in the tag close #2135 --- files/zh-cn/web/javascript/guide/grammar_and_types/index.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'files/zh-cn/web/javascript') diff --git a/files/zh-cn/web/javascript/guide/grammar_and_types/index.html b/files/zh-cn/web/javascript/guide/grammar_and_types/index.html index 0ea7538a96..8b00401fcc 100644 --- a/files/zh-cn/web/javascript/guide/grammar_and_types/index.html +++ b/files/zh-cn/web/javascript/guide/grammar_and_types/index.html @@ -447,8 +447,8 @@ console.log(a[0]); // 33.14 -.2345789 // -0.23456789 --3.12e+12 // -3.12*1012 -.1e-23 // 0.1*10-23=10-24=1e-24 +-3.12e+12 // -3.12*10^12 +.1e-23 // 0.1*10^(-23)=10^(-24)=1e-24对象字面量 (Object literals)
-- cgit v1.2.3-54-g00ecf From 9ed29ef674f52e89eb4d95b7b92da9e25d4c8b7f Mon Sep 17 00:00:00 2001 From: 周盛道 <26922dd@sina.com> Date: Mon, 23 Aug 2021 23:42:31 +0800 Subject: Fix mistranslation in Web/JavaScript/Guide/Text_formatting, zh-CN (#2189) --- files/zh-cn/web/javascript/guide/text_formatting/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'files/zh-cn/web/javascript') diff --git a/files/zh-cn/web/javascript/guide/text_formatting/index.html b/files/zh-cn/web/javascript/guide/text_formatting/index.html index 522b3ed362..eac38b4502 100644 --- a/files/zh-cn/web/javascript/guide/text_formatting/index.html +++ b/files/zh-cn/web/javascript/guide/text_formatting/index.html @@ -62,7 +62,7 @@ typeof foo; // 返回 'object'
const firstString = '2 + 2'; //创建一个字符串字面量 const secondString = new String('2 + 2'); // 创建一个字符串对象 eval(firstString); // 返回数字 4 -eval(secondString); // 返回字符串 "2 + 2"+eval(secondString); // 返回包含 "2 + 2" 的字符串对象
String
对象有一个属性 length
,标识了字符串中 UTF-16 的码点个数。举例,下面的代码把 13 赋值给了helloLength
,因为 "Hello, World!" 包含 13 个字符,每个字符用一个 UTF-16 码点表示。你可以通过数组的方式访问每一个码点,但你不能修改每个字符,因为字符串是不变的类数组对象:
JavaScript的 Array
对象是用于构造数组的全局对象,数组是类似于列表的高阶对象。
创建数组
- -var fruits = ['Apple', 'Banana']; - -console.log(fruits.length); -// 2 -- -
通过索引访问数组元素
- -var first = fruits[0]; -// Apple - -var last = fruits[fruits.length - 1]; -// Banana- -
遍历数组
- -fruits.forEach(function (item, index, array) { - console.log(item, index); -}); -// Apple 0 -// Banana 1- -
添加元素到数组的末尾
- -var newLength = fruits.push('Orange'); -// newLength:3; fruits: ["Apple", "Banana", "Orange"]- -
删除数组末尾的元素
- -var last = fruits.pop(); // remove Orange (from the end) -// last: "Orange"; fruits: ["Apple", "Banana"];- -
删除数组最前面(头部)的元素
- -var first = fruits.shift(); // remove Apple from the front -// first: "Apple"; fruits: ["Banana"];- -
添加元素到数组的头部
- -var newLength = fruits.unshift('Strawberry') // add to the front -// ["Strawberry", "Banana"]; -- -
找出某个元素在数组中的索引
- -fruits.push('Mango'); -// ["Strawberry", "Banana", "Mango"] - -var pos = fruits.indexOf('Banana'); -// 1- -
通过索引删除某个元素
- -var removedItem = fruits.splice(pos, 1); // this is how to remove an item - -// ["Strawberry", "Mango"]- -
从一个索引位置删除多个元素
- -var vegetables = ['Cabbage', 'Turnip', 'Radish', 'Carrot']; -console.log(vegetables); -// ["Cabbage", "Turnip", "Radish", "Carrot"] - -var pos = 1, n = 2; - -var removedItems = vegetables.splice(pos, n); -// this is how to remove items, n defines the number of items to be removed, -// from that position(pos) onward to the end of array. - -console.log(vegetables); -// ["Cabbage", "Carrot"] (the original array is changed) - -console.log(removedItems); -// ["Turnip", "Radish"]- -
复制一个数组
- -var shallowCopy = fruits.slice(); // this is how to make a copy -// ["Strawberry", "Mango"]- -
[element0, element1, ..., elementN] -new Array(element0, element1[, ...[, elementN]]) -new Array(arrayLength) -- -
elementN
Array
构造器会根据给定的元素创建一个 JavaScript 数组,但是当仅有一个参数且为数字时除外(详见下面的 arrayLength
参数)。注意,后面这种情况仅适用于用 Array
构造器创建数组,而不适用于用方括号创建的数组字面量。arrayLength
length
的值等于 arrayLength
的数组对象(言外之意就是该数组此时并没有包含任何实际的元素,不能理所当然地认为它包含 arrayLength
个值为 undefined
的元素)。如果传入的参数不是有效值,则会抛出 {{jsxref("RangeError")}} 异常。数组是一种类列表对象,它的原型中提供了遍历和修改元素的相关操作。JavaScript 数组的长度和元素类型都是非固定的。因为数组的长度可随时改变,并且其数据在内存中也可以不连续,所以 JavaScript 数组不一定是密集型的,这取决于它的使用方式。一般来说,数组的这些特性会给使用带来方便,但如果这些特性不适用于你的特定使用场景的话,可以考虑使用类型数组 {{jsxref("TypedArray")}}。
- -只能用整数作为数组元素的索引,而不能用字符串。后者称为关联数组。使用非整数并通过方括号或点号来访问或设置数组元素时,所操作的并不是数组列表中的元素,而是数组对象的属性集合上的变量。数组对象的属性和数组元素列表是分开存储的,并且数组的遍历和修改操作也不能作用于这些命名属性。
- -JavaScript 数组的索引是从0开始的,第一个元素的索引为0,最后一个元素的索引等于该数组的长度减1。如果指定的索引是一个无效值,JavaScript 数组并不会报错,而是会返回 undefined
。
var arr = ['this is the first element', 'this is the second element', 'this is the last element']; -console.log(arr[0]); // 打印 'this is the first element' -console.log(arr[1]); // 打印 'this is the second element' -console.log(arr[arr.length - 1]); // 打印 'this is the last element' -- -
虽然数组元素可以看做是数组对象的属性,就像 toString
一样,但是下面的写法是错误的,运行时会抛出 SyntaxError
异常,而原因则是使用了非法的属性名:
console.log(arr.0); // a syntax error --
并不是 JavaScript 数组有什么特殊之处,而是因为在 JavaScript 中,以数字开头的属性不能用点号引用,必须用方括号。比如,如果一个对象有一个名为 3d
的属性,那么只能用方括号来引用它。下面是具体的例子:
var years = [1950, 1960, 1970, 1980, 1990, 2000, 2010]; -console.log(years.0); // 语法错误 -console.log(years[0]); // √ --
renderer.3d.setTexture(model, 'character.png'); // 语法错误 -renderer['3d'].setTexture(model, 'character.png'); // √ -- -
注意在 3d
那个例子中,引号是必须的。你也可以将数组的索引用引号引起来,比如 years[2]
可以写成 years['2']
。 years[2]
中的 2 会被 JavaScript 解释器通过调用 toString
隐式转换成字符串。正因为这样,'2'
和 '02'
在 years
中所引用的可能是不同位置上的元素。而下面这个例子也可能会打印 true
:
console.log(years['2'] != years['02']); --
类似地,如果对象的属性名称是保留字(最好不要这么做!),那么就只能通过字符串的形式用方括号来访问(从 firefox 40.0a2 开始也支持用点号访问了):
- -var promise = { - 'var' : 'text', - 'array': [1, 2, 3, 4] -}; - -console.log(promise['var']); -- -
JavaScript 数组的 {{jsxref("Array.length", "length")}} 属性和其数字下标之间有着紧密的联系。数组内置的几个方法(例如 {{jsxref("Array.join", "join")}}、{{jsxref("Array.slice", "slice")}}、{{jsxref("Array.indexOf", "indexOf")}} 等)都会考虑 {{jsxref("Array.length", "length")}} 的值。另外还有一些方法(例如 {{jsxref("Array.push", "push")}}、{{jsxref("Array.splice", "splice")}} 等)还会改变 {{jsxref("Array.length", "length")}} 的值。
- -var fruits = []; -fruits.push('banana', 'apple', 'peach'); - -console.log(fruits.length); // 3 -- -
使用一个合法的下标为数组元素赋值,并且该下标超出了当前数组的大小的时候,解释器会同时修改 {{jsxref("Array.length", "length")}} 的值:
- -fruits[5] = 'mango'; -console.log(fruits[5]); // 'mango' -console.log(Object.keys(fruits)); // ['0', '1', '2', '5'] -console.log(fruits.length); // 6 -- -
也可以显式地给 {{jsxref("Array.length", "length")}} 赋一个更大的值:
- -fruits.length = 10; -console.log(Object.keys(fruits)); // ['0', '1', '2', '5'] -console.log(fruits.length); // 10 --
而为 {{jsxref("Array.length", "length")}} 赋一个更小的值则会删掉一部分元素:
- -fruits.length = 2; -console.log(Object.keys(fruits)); // ['0', '1'] -console.log(fruits.length); // 2- -
这一节的内容在 {{jsxref("Array.length")}} 中有更详细的介绍。
-使用正则表达式匹配字符串可以得到一个数组。这个数组中包含本次匹配的相关信息和匹配结果。{{jsxref("RegExp.exec")}}、{{jsxref("String.match")}}、{{jsxref("String.replace")}} 都会返回这样的数组。看下面的例子和例子下面的表格:
- -// 匹配1个 d 后面紧跟着至少1个 b,再后面又跟着1个 d 的子串, -// 并且需要记住子串中匹配到的 b 和最后的 d (通过正则表达式中的分组), -// 同时在匹配时忽略大小写 - -myRe = /d(b+)(d)/i; -myArray = myRe.exec("cdbBdbsbz"); -- -
该正则匹配返回的数组包含以下属性和元素:
- -属性/元素 | -说明 | -示例 | -
input |
- 只读属性,原始字符串 | -cdbBdbsbz | -
index |
- 只读属性,匹配到的子串在原始字符串中的索引 | -1 | -
[0] |
- 只读元素,本次匹配到的子串 | -dbBd | -
[1], ...[n] |
- 只读元素,正则表达式中所指定的分组所匹配到的子串,其数量由正则中的分组数量决定,无最大上限 | -[1]: bB - [2]: d |
-
Array.length
Array
构造函数的 length 属性,其值为1(注意该属性为静态属性,不是数组实例的 length 属性)。Array
构造函数。所有数组实例都会从 {{jsxref("Array.prototype")}} 继承属性和方法。修改 Array
的原型会影响到所有的数组实例。
{{page('zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Mutator_methods')}}
- -{{page('zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Accessor_methods')}}
- -{{page('zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Iteration_methods')}}
- -泛型方法是非标准,并且已弃用,有可能不久就会移除。 需注意的是此方法同时有跨浏览器问题. 但是 Github上有可用的shim。
-有时我们会希望在字符串或其他类数组对象上使用数组所提供的方法(如函数的 {{jsxref("Functions/arguments", "arguments", "", 1)}})。此时你可以把一个字符串作为一个字符数组来看待(也就是说,把非数组以某种方式看成是一个数组)。比如,可以用下面的方法来检查变量 str
中的字符是否都是字母:
function isLetter(character) { - return character >= 'a' && character <= 'z'; -} - -if (Array.prototype.every.call(str, isLetter)) { - console.log("The string '" + str + "' contains only letters!"); -}- -
这种方法能够行得通,但不够简洁,JavaScript 1.6 中引入了一个泛型化的简写形式:
- -if (Array.every(str, isLetter)) { - console.log("The string '" + str + "' contains only letters!"); -}- -
{{jsxref("Global_Objects/String", "String")}} 对象也包含一些泛型方法,见: {{jsxref("Global_Objects/String", "Generics", "#String_generic_methods", 1)}}。
- -注意,这些并不属于 ECMAScript 标准,也不能在非 Gecko 浏览器中使用。你可以用标准方法 {{jsxref("Array.from()")}} 来替代上面的写法, from
方法可以将一个对象转换为真正的数组(虽然老的浏览器可能不支持):
if (Array.from(str).every(isLetter)) {
- console.log("The string '" + str + "' contains only letters!");
-}
-
-下面这个例子创建了一个长度为 0 的数组 msgArray
,然后给 msgArray[0]
和 msgArray[99]
赋值,从而导致数组长度变为了 100。
var msgArray = []; -msgArray[0] = 'Hello'; -msgArray[99] = 'world'; - -if (msgArray.length === 100) { - console.log('The length is 100.'); -}- -
下面的例子创建了一个代表国际象棋棋盘的二维数组,然后将 (6, 4) 上的 Pawn (卒)拷贝到 (4, 4) 位置,而原本 (6, 4) 位置则被设置为空格。
- -var board = [ - ['R','N','B','Q','K','B','N','R'], - ['P','P','P','P','P','P','P','P'], - [' ',' ',' ',' ',' ',' ',' ',' '], - [' ',' ',' ',' ',' ',' ',' ',' '], - [' ',' ',' ',' ',' ',' ',' ',' '], - [' ',' ',' ',' ',' ',' ',' ',' '], - ['p','p','p','p','p','p','p','p'], - ['r','n','b','q','k','b','n','r'] ]; - -console.log(board.join('\n') + '\n\n'); - -// Move King's Pawn forward 2 -board[4][4] = board[6][4]; -board[6][4] = ' '; -console.log(board.join('\n')); -- -
下面是输出:
- -R,N,B,Q,K,B,N,R -P,P,P,P,P,P,P,P - , , , , , , , - , , , , , , , - , , , , , , , - , , , , , , , -p,p,p,p,p,p,p,p -r,n,b,q,k,b,n,r - -R,N,B,Q,K,B,N,R -P,P,P,P,P,P,P,P - , , , , , , , - , , , , , , , - , , , ,p, , , - , , , , , , , -p,p,p,p, ,p,p,p -r,n,b,q,k,b,n,r -- -
values = [];
-for (var x = 0; x < 10; x++){
- values.push([
- 2 ** x,
- 2 * x ** 2
- ])
-};
-console.table(values)
-
-结果为:
- -0 1 0
-1 2 2
-2 4 8
-3 8 18
-4 16 32
-5 32 50
-6 64 72
-7 128 98
-8 256 128
-9 512 162
-
-(第一列为索引)
- -规范 | -状态 | -说明 | -
---|---|---|
{{SpecName('ES1')}} | -{{Spec2('ES1')}} | -初始定义。 | -
{{SpecName('ES5.1', '#sec-15.4', 'Array')}} | -{{Spec2('ES5.1')}} | -新增方法: {{jsxref("Array.isArray")}}, {{jsxref("Array.prototype.indexOf", "indexOf")}}, {{jsxref("Array.prototype.lastIndexOf", "lastIndexOf")}}, {{jsxref("Array.prototype.every", "every")}}, {{jsxref("Array.prototype.some", "some")}}, {{jsxref("Array.prototype.forEach", "forEach")}}, {{jsxref("Array.prototype.map", "map")}}, {{jsxref("Array.prototype.filter", "filter")}}, {{jsxref("Array.prototype.reduce", "reduce")}}, {{jsxref("Array.prototype.reduceRight", "reduceRight")}} | -
{{SpecName('ES6', '#sec-array-objects', 'Array')}} | -{{Spec2('ES6')}} | -
- 新增方法:{{jsxref("Array.from")}}, {{jsxref("Array.of")}}, {{jsxref("Array.prototype.find", "find")}}, {{jsxref("Array.prototype.findIndex", "findIndex")}}, {{jsxref("Array.prototype.fill", "fill")}}, {{jsxref("Array.prototype.copyWithin", "copyWithin")}} - |
-
{{SpecName('ESDraft', '#sec-array-objects', 'Array')}} | -{{Spec2('ESDraft')}} | -
- 新增方法:{{jsxref("Array.prototype.includes()")}} - |
-
Array
Object”属性/元素 + | 说明 + | 示例 + |
---|---|---|
input {{ReadOnlyInline}} |
+ 正则表达式所匹配的原始字符串 | +"cdbBdbsbz" |
+
index {{ReadOnlyInline}} |
+ 匹配到的子串在原始字符串中的索引 | +1 |
+
[0] {{ReadOnlyInline}} |
+ 最后匹配到的子串 | +"dbBd" |
+
[1], ...[n] {{ReadOnlyInline}} |
+ 正则表达式中所指定的分组所匹配到的子串,其数量由正则中的分组数量决定,无最大上限 | +
+ [1]: "bB"
+ |
+