Новые методы массива: 1. from(), способный преобразовать массивоподобный или итерируемый объект в реальный массив; 2. of(), способный преобразовать набор значений в массив, что компенсирует недостатки; конструктора массива Array() ; 3. find() и findIndex() возвращаем первый элемент массива, соответствующий условиям 4. fill() и так далее;
Как быстро начать работу с VUE3.0: Войдите в
операционную среду этого руководства: система Windows 7, ECMAScript версии 6, компьютер Dell G3.
1. Array.from()
Метод Array.from используется для преобразования двух типов объектов в реальные массивы:
массивоподобных объектов и
итерируемых объектов (включая новые ES6. Структура данных Set и Map)
означает, что пока при развертывании структуры данных интерфейса Iterator Array.from может преобразовать ее в массив.
В реальной разработке ее обычно можно использовать для преобразования коллекции NodeList, возвращаемой операцией DOM, а также аргументов внутри функции.
Когдаобъект
передает параметр, он используется для преобразования массива класса в реальный массив массива
для устранения дублирования.
const arr = [1,2,3,3,3,2,5]; console.log(Array.from(new Set(arr))); //[1,2,3,5] //...Того же эффекта можно добиться console.log([...new Set(arr)]) //[1,2,3,5]
Для браузеров, которые не развертывают этот метод, вы можете использовать Метод Array.prototype.slice вместо
Costnt toArray = (() => {
Array.from ? Array.from : obj => [].slice.call(obj)
})() также может получать второй параметр, который передается в функцию для достижения эффекта, аналогичного методу карты, обрабатывающего каждый элемент и возвращающего обработанный массив
Array.from([1,2,3 ], item => item *2) //[2,4,6]
Длина возвращаемой строки
может использоваться для преобразования строки в массив, а затем возврата длины строки, поскольку она может правильно обрабатывать различные символы Юникода. Это позволяет избежать Собственная ошибка JS, связанная с подсчетом символов Юникода, превышающих /uFFFF, как 2 символа
function countLength(string) {
вернуть Array.from(строка).длина
} 2. Array.of()
Метод Array.of используется для преобразования набора значений в массив. Компенсируйте недостатки конструктора массива Array(). Поскольку количество параметров разное, поведение Array() будет другим
// Следующий код показывает разницу Array.of(3); // [3];
Массив.of(3, 11, 8); // [3,11,8];
новый массив(3); // [, , ,]
новый массив (3, 11, 8); // [3, 11, 8];
//Метод Array.of можно смоделировать с помощью следующего кода.
функция ArrayOf() {
вернуть [].slice.call(аргументы);
} 3. Find() и findIndex() экземпляров массива.
find()
возвращает первый элемент массива, соответствующий условиям. Его параметром является функция обратного вызова. Все члены массива последовательно выполняют эту функцию до тех пор, пока не будет найден первый элемент, соответствующий условиям. найден член, а затем вернуть член. Если члена, соответствующего условиям, нет, верните undef.
Функция обратного вызова этого метода получает три параметра: текущее значение, текущую позицию,
пример исходного массива 1
[1,12,4].
,0,5] .find((item,index, arr) => return item < 1) // 0
Пример 2
// find()
var item = [1, 4, -5, 10].find(n => n <0);
console.log(элемент); // -5
// find также поддерживает такой сложный поиск var Points = [
{
х: 10,
й: 20
},
{
х: 20,
й: 30
},
{
х: 30,
й: 40
},
{
х: 40,
й: 50
},
{
х: 50,
й: 60
}
];
points.find(function matcher(point) {
return point.x % 3 == 0 && point.y % 4 == 0;
}); // { x: 30, y: 40 } Написание и использование findIndex()
в основном такие же, как и метода find(). Он просто возвращает позицию первого элемента массива, который соответствует условиям. отсутствует, возвращается -1.
Пример 1
[1,2,4,15,0].findIndex((item, index,arr) => return item > 10) //3Пример
2
var Points = [
{
х: 10,
й: 20
},
{
х: 20,
й: 30
},
{
х: 30,
й: 40
},
{
х: 40,
й: 50
},
{
х: 50,
й: 60
}
];
points.findIndex(function matcher(point) {
return point.x % 3 == 0 && point.y % 4 == 0;
}); // 2
points.findIndex(function matcher(point) {
return point.x % 6 == 0 && point.y % 7 == 0;
}); //1 4. Метод fill(
// Метод fill заполняет массив заданным значением.
вар fillArray = новый массив (6).fill (1);
console.log(fillArray); //[1, 1, 1, 1, 1, 1]
//Метод fill также может принимать второй и третий параметры, которые используются для указания начальной и конечной позиции заливки.
["a", "b", "c"].fill(7, 1, 2);
// ['а', 7, 'в']
// Обратите внимание: если заполненный тип является объектом, то назначенный объект — это тот же адрес памяти, а не объект глубокой копии.
пусть arr = new Array(3).fill({
имя: «Майк»
});
arr[0].name = "Бен";
console.log(обр);
// [{name: "Ben"}, {name: "Ben"}, {name: "Ben"}] Оба метода могут найти NaN в массиве, но indexOf() в ES5 не может найти NaN 5. Три.
методыelements(),keys() иvalues() экземпляра массива
используются для перемещения по массиву, и все они возвращают объект-переходчик. Для перемещения по массиву можно использовать цикл for...of
.
keys() — это пара имен ключей.
Обход
значений ключей
.
()) {
console.log(индекс);
}
// 0 1
for (let elem of ["a", "b"].values()) {
console.log(элем);
}
//аб
for (let [index, elem] of ["a", "b"].entries()) {
console.log(индекс, элемент);
}
// 0 "а"
// 1 "б"
вар а = [1, 2, 3];
[...a.values()]; // [1,2,3]
[...a.keys()]; // [0,1,2]
[...a.entries()]; // [ [0,1], [1,2], [2,3] ] 6. Метод include() возвращает логическое значение
. , указывающий, содержит ли массив заданное значение
[1, 2, 3].includes(2) // true [(1, 2, 3)].includes(4) // false
также может получать второй параметр, указывающий начальную позицию поиска, значение по умолчанию — 0. Если второй параметр представляет собой отрицательное число, он указывает позицию числа. Если второй параметр больше длины массива, метод include начинается с индекса 0,
чтобы компенсировать недостатки метода indexOf, который недостаточно семантичен и неверно оценивает NaN
[1, 23, NaN].includes(NaN). // истинный
совместимый метод:
функция содержит = ( () => {
Массив.prototype.includes
?(arr, val) => arr.includes(val)
:(arr, val) => arr.some(item => return item === val)
})() 7. Flat() экземпляров массива, FlatMap().
// Flat()
[1, 2, [3, [4, 5]]].квартира()
// [1, 2, 3, [4, 5]]
[1, 2, [3, [4, 5]]].квартира(2)
// [1, 2, 3, 4, 5]
//плоская карта()
[2, 3, 4].flatMap((x) => [x, x * 2])
//После выполнения карты это [[2, 4], [3, 6], [4, 8]]
//Затем выполните метод Flat(), чтобы получить следующий результат // [2, 4, 3, 6, 4, 8]
// FlatMap() может расширять только один уровень массива.
// Эквивалент .flat()
[1, 2, 3, 4].flatMap(x => [
[х*2]
])
//После выполнения карты это [[[2]], [[4]], [[6]], [[8]]]
//Затем выполните метод Flat(), чтобы получить следующие результаты // [[2], [4], [6], [8]] Скопируйте код 8. Функция copywithin() экземпляра массива
скопирует элемент по адресу указанную позицию внутри текущего массива. Скопируйте в другие позиции, а затем вернитесь к текущему массиву, что изменит исходный массив,
чтобы получить три параметра:
1. цель (обязательно) начать замену данных с этой позиции
2. начать (необязательно) начать чтение данных с этой позиции, по умолчанию — 0. Если это отрицательное число, это означает
прекращение чтения данных до достижения числа 3 и окончания (необязательно). Значение по умолчанию равно длине массива. Если это отрицательное число, это означает, что
все три параметра должны быть числами. Если нет, они будут автоматически преобразованы в числовые значения
[1,2,3,4,5].copywithin(0,3 /); /[4,5,3 ,4,5] означает, что элементы от индекса 3 до конца (4,5) копируются в позицию, начиная с индекса 0, а исходные 1 и 2 заменяются.