The sequence generator generates a sequence with a specified start value and end value, and generates a sequence array based on the specified interval length.
To complete this function, you need to use the from() object of the Array built-in object, as well as array-like related knowledge. There are relevant cases for demonstration in the previous articles.
Address 1: JavaScript built-in object - Array array (2) - method_Awakening Master's Blog-CSDN Blog
Address 2: JavaScript built-in object - Array array (3) - Custom ArrayList_Awakening Master's Blog-CSDN Blog
1. Class array
An array-like object refers to an object that can access elements through index properties and has a length property.
The difference between array-like objects and arrays is that array-like objects cannot directly call array methods, but need to call them indirectly through Function.call and Function.apply.
Array-like objects start from zero, use increasing integers as keys, and define an object whose length represents the number of elements. It is called an array-like object.
Many people may be unfamiliar with class arrays and the Array.from() method. I hope that through this case, everyone will understand their functions and conveniences.
Example:
const objArr = {
0: "How",
1: "are",
2: "you",
length: 3
}2. from() method
The Array.from() method creates a new array from an array-like or iterable object and returns it. The details of the from() method can be found in "Address 1". Here we know that it can convert a class array into a new array instance. The example is as follows:
const objArr = { 0: "How", 1: "are", 2: "you", length: 3 }
console.log(Array.from(objArr));The output is as follows:
[ 'How', 'are', 'you' ]
3. Sequence generator implementation
3.1 Generate an array of specified length
By creating a class array and specifying its length, convert it into an empty array of the specified length through the Array.from() method, and then implement the element increment function through a loop.
Example:
/**
* 序列生成器
*/
const generatorSequence = (start, end, step) => {
// 生成一个指定长度的空数组
let arr = Array.from({ length: (end - start) / step + 1 });
console.log(arr);
}
// 生成0~9元素的数组，每递增为1
generatorSequence(0, 9, 1);Output result:
[
undefined, undefined,
undefined, undefined,
undefined, undefined,
undefined, undefined,
undefined, undefined
]
3.2 Implement incremental functions
If the second parameter of the Array.from() method is specified, the callback function will be executed for each element in the new array. So you can use this feature to increment all undefined loops in the empty array to sequence values.
Example:
/**
* 序列生成器
*/
const generatorSequence = (start, end, step) => {
// 生成一个指定长度的空数组
// (_, i) 因为空数组，所以第一个参数 “_” 返回结果为undefined，第二个参数“i”为索引值
let arr = Array.from({ length: (end - start) / step + 1 }, (_, i) => start + (i * step));
console.log(arr);
}
// 生成0~9元素的数组，每递增为1
generatorSequence(0, 9, 1);Output result:
[
0, 1, 2, 3, 4,
5, 6, 7, 8, 9
]
At this point, the sequence generator has been implemented. This function is not complicated. Let's optimize it. The code is as follows:
/**
* 序列生成器
*/
const generatorSequence = (start, end, step) =>
Array.from(
{ length: (end - start) / step + 1 },
(_, i) => start + (i * step)
);
// 生成0~9元素的数组，每递增为1
const arr = generatorSequence(0, 5, 1);
// 输出结果
console.log(arr);Output result:
[ 0, 1, 2, 3, 4, 5 ]
3.3 Generate even numbers
Example:
/**
* 序列生成器
*/
const generatorSequence = (start, end, step) =>
Array.from(
{ length: (end - start) / step + 1 },
(_, i) => start + (i * step)
);
// 生成偶数
const arr = generatorSequence(0, 10, 2);
// 输出结果
console.log(arr);Output result:
[ 0, 2, 4, 6, 8, 10 ]
3.4 Year of creation
Example:
/**
* 序列生成器
*/
const generatorSequence = (start, end, step) =>
Array.from(
{ length: (end - start) / step + 1 },
(_, i) => start + (i * step)
);
// 生成0~9元素的数组，每递增为1
const arr = generatorSequence(2010, 2023, 1);
// 输出结果
console.log(arr);Output result:
[
2010, 2011, 2012,
2013, 2014, 2015,
2016, 2017, 2018,
2019, 2020, 2021,
2022, 2023
]
3.5 Convert year to Object
Example:
/**
* 序列生成器
*/
const generatorSequence = (start, end, step) =>
Array.from(
{ length: (end - start) / step + 1 },
(_, i) => start + (i * step)
);
// 生成0~9元素的数组，每递增为1
const arr = generatorSequence(2010, 2023, 1).map(item => {
return {
label: item,
value: item
}
});
// 输出结果
console.log(arr);Output result:
[
{ label: 2010, value: 2010 },
{ label: 2011, value: 2011 },
{ label: 2012, value: 2012 },
{ label: 2013, value: 2013 },
{ label: 2014, value: 2014 },
{ label: 2015, value: 2015 },
{ label: 2016, value: 2016 },
{ label: 2017, value: 2017 },
{ label: 2018, value: 2018 },
{ label: 2019, value: 2019 },
{ label: 2020, value: 2020 },
{ label: 2021, value: 2021 },
{ label: 2022, value: 2022 },
{ label: 2023, value: 2023 }
]
3.6 Generate letters A~Z
The charCodeAt() method will be used here, which is a string method used to retrieve the Unicode value of a specific character. When generating Unicode codes between A~Z, you need to use the fromCharCode() method, which is also a string method and is used to convert Unicode codes into characters.
Example:
/**
* 序列生成器
*/
const generatorSequence = (start, end, step) =>
Array.from(
{ length: (end - start) / step + 1 },
(_, i) => start + (i * step)
);
// 生成A~Z之间字符
const arr = generatorSequence('A'.charCodeAt(0), 'Z'.charCodeAt(0), 1);
// 输出结果
console.log(arr);Output result:
[
65, 66, 67, 68, 69, 70, 71, 72,
73, 74, 75, 76, 77, 78, 79, 80,
81, 82, 83, 84, 85, 86, 87, 88,
89, 90
]
The above are all Unicode codes, so after generating the sequence array, you can use the Array.map() method to convert all values into characters. The code is as follows:
/**
* 序列生成器
*/
const generatorSequence = (start, end, step) =>
Array.from(
{ length: (end - start) / step + 1 },
(_, i) => start + (i * step)
);
// 生成A~Z之间字符
const arr = generatorSequence('A'.charCodeAt(0), 'Z'.charCodeAt(0), 1)
.map(item => String.fromCharCode(item));
// 输出结果
console.log(arr);Output result:
[
'A', 'B', 'C', 'D', 'E', 'F',
'G', 'H', 'I', 'J', 'K', 'L',
'M', 'N', 'O', 'P', 'Q', 'R',
'S', 'T', 'U', 'V', 'W', 'X',
'Y', 'Z'
]
3.7 Chinese character generation
Since letters can be generated, Chinese characters can also be generated. However, Unicode does not support Chinese characters very well. There are a total of 60,000 to 70,000 Chinese characters in simplified and traditional Chinese, and UCS-2 can represent up to 65,536, so Unicode can only exclude some rarely used Chinese characters.
Example:
/**
* 序列生成器
*/
const generatorSequence = (start, end, step) =>
Array.from(
{ length: (end - start) / step + 1 },
(_, i) => start + (i * step)
);
// 生成汉字
const arr = generatorSequence('一'.charCodeAt(0), '二'.charCodeAt(0), 1)
.map(item => String.fromCharCode(item));
// 输出结果
console.log(arr);Output result:
[
'一', '丁', '丂', '七', '丄', '丅', '丆', '万', '张', '三', '上', '下',
'丏', '不', '和', '丏', 'beggar', 'ugly', '丒', 'Zhuan', 'Qi', 'Pi', '世', '丗', 'Qiu
' , 'bing', 'ye', 'cong', 'dong', 'si', 'cheng', 'die', '丠', '両', 'die', '丣', 'two',
' Yan', 'bin', 'sang', '丨', '丩', 'ge', '丫', '丬', '中', '丮', '丯', 'Feng', '丱
' , 'chuan', '丳', 'lin', '丵', '丶', '丷', 'Wan', 'Dan', 'Wei', 'Zhu',
'丼', '丽', 'Ju', '丿', '乀', '乁', '乂', 'Nai', '乄', 'Jiu', '乆', '乇', '灹
' ', 'Yi', '乊', 'Zhi', 'Wu', 'Zha', 'Hu', 'Wu', 'Le', '乑', 'Ping', 'Pong', 'Qiao'
, '乕', 'guai', '成', '成', 'yi', '乚', '乛', '乜', '九', 'beg', 'ye', 'xi', 'xiang
' ', '乢', '乣',
... 41 more items
]'Wu', 'Zha', 'Hu', 'Wu', 'Le', '乑', 'Ping', 'Pong ', 'Qiao', '乕', 'Guai', '成', '成', 'yi', '乚', '乛', '乜', '九', 'beg', 'ye', 'xi', 'xiang', '乢', '乣', ... 41 more items ]'Wu', 'Zha', 'Hu', 'Wu', 'Le', '乑', 'Ping', 'Pong ', 'Qiao', '乕', 'Guai', '成', '成', 'yi', '乚', '乛', '乜', '九', 'beg', 'ye', 'xi', 'xiang', '乢', '乣', ... 41 more items ]
The related functions of the sequence generator will be introduced here for the time being. I hope it will be useful to everyone.