1. Массив
multArrayПреобразование 2D-массива
Разделите массив (массив) на несколько подмассивов и объедините эти подмассивы в новый массив.
multArray(array, count)
параметр
-
arrayмассив для обработки -
count = 8требуемая длина подмассива
Пример
multArray([1, 2, 3, 4, 5, 6], 2)
=> [[1, 2], [3, 4], [5, 6]]
multArray(['a', 'b', 'c', 'd'], 3)
=> [['a', 'b', 'c'], ['d']]
исходный код
flattenсглаженный массив
Разделить многоуровневый вложенный массив (массив) на массив
flatten(array)
параметр
-
arrayмногоуровневый вложенный массив
Пример
flatten([1, [2], [3], [4, 5]])
// [1, 2, 3, 4, 5]
исходный код
flattenDeepсглаженный массив на указанном уровне
Разделить многоуровневый вложенный массив (массив) на заданный массив уровней
flattenDeep(array, depth)
параметр
-
arrayмногоуровневый вложенный массивdepth =Уменьшено количество уровней вложенности
Пример
flattenDeep(['a', ['b', ['c', ['d']], 'e']], 1)
// => ['a', 'b', ['c', ['d']], 'e']
// ES6方法 `flat(depth)`
['a', ['b', ['c', ['d']], 'e']].flat(1)
// => ['a', 'b', ['c', ['d']], 'e']
исходный код
isArrayEqualПроверить, что два члена массива равны
Сравнивает, равны ли значения в двух массивах, и возвращаетBooleanценность
isArrayEqual(arrOne, arrTwo)
параметр
-
arrOneмассив для проверки -
arrTwoмассив для проверки
Пример
isArrayEqual([6, 5, 2, 4, 1, 3], [1, 2, 3, 4, 5, 6])
// => true
isArrayEqual([6, 5, 2, 7, 1, 3], [1, 2, 3, 4, 5, 6])
// => false
исходный код
allEqualПроверить, что элементы массива равны
allEqual(array)
параметр
-
arrayмассив для проверки
Пример
allEqual([1, 2, 3, 4, 5, 6])
// => false
allEqual([1, 1, 1, 1])
// => true
исходный код
diffArrayимеет уникальныйarrayмассив значений
Создает массив с уникальными значениями массива, каждое из которых не содержится в других заданных массивах.
diffArray(arrOne, arrTwo)
параметр
-
arrOneмассив для проверки -
arrTwoмассив для исключения
Пример
diffArray(['a', 2, 6, 7], ['a', 2, 9, 'b'])
// => [ 6, 7 ]
исходный код
haveArrиметь общийarrayмассив значений
Создает массив с общими значениями массива, каждое из которых содержится в другом заданном массиве.
haveArr(arrOne, arrTwo)
параметр
-
arrOneмассив для проверки -
arrTwoмассив, который будет содержать
Пример
haveArr([1, 2, 6, 7], [1, 2, 9, 5])
// => [ 1, 2 ]
исходный код
uniqueArrayДедупликация массива
Создать дедуплицированную копию массива массива
uniqueArray(array)
параметр
-
arrayмассив для дедупликации
Пример
uniqueArray([1, 2, 2, 3, 4, 4, 5])
// => [ 1, 2, 3, 4, 5 ]
исходный код
uniqueArrayObjectДедупликация объектов массива
Создайте дедуплицированную копию объекта массива массива
uniqueArrayObject(array)
параметр
-
arrayмассив для дедупликации -
keyЗначение свойства объекта для дедупликации
Пример
const responseList = [
{ id: 1, a: 1 },
{ id: 2, a: 2 },
{ id: 3, a: 3 },
{ id: 1, a: 4 },
{ id: 2, a: 2 },
{ id: 3, a: 3 },
{ id: 1, a: 4 },
{ id: 2, a: 2 },
{ id: 3, a: 3 },
{ id: 1, a: 4 },
{ id: 2, a: 2 },
{ id: 3, a: 3 },
{ id: 1, a: 4 },
]
uniqueArrayObject(responseList, 'id')
// => [ { id: 1, a: 1 }, { id: 2, a: 2 }, { id: 3, a: 3 } ]
исходный код
treeDataданные структуры связующего дерева
В функцию передается массив, каждый элементidсоответствующий своим родительским даннымparent_id, который возвращает массив с древовидной структурой
treeData(array, id, parent_id)
параметр
-
arrayмассив для создания древовидной структуры -
idимя пользовательского атрибута -
parent_idИмя родительского настраиваемого свойства
Пример
const comments = [
{ id: 1, parent_id: null },
{ id: 2, parent_id: 1 },
{ id: 3, parent_id: 1 },
{ id: 4, parent_id: 2 },
{ id: 5, parent_id: 4 },
]
treeData(comments)
// => [ { id: 1, parent_id: null, children: [ { id: 2, parent_id: 1, children: [ { id: 4, parent_id: 2, children: [ { id: 5, parent_id: 4, children: [] } ] } ] }, { id: 3, parent_id: 1, children: [] } ] } ]
исходный код
flatArrFuncмассив генерации данных древовидной структуры
Эта функция передает массив с древовидной структурой и возвращает массив
flatArrFunc(array)
параметр
-
arrayмассив для обхода древовидной структуры
Пример
const list = [ { id: 1, parent_id: null, children: [ { id: 2, parent_id: 1, children: [ { id: 4, parent_id: 2, children: [ { id: 5, parent_id: 4, children: [] } ] } ] }, { id: 3, parent_id: 1, children: [] } ] } ]
flatArrFunc(list)
// => [
{ id: 1, parent_id: null },
{ id: 2, parent_id: 1 },
{ id: 3, parent_id: 1 },
{ id: 4, parent_id: 2 },
{ id: 5, parent_id: 4 },
]
исходный код
ascArrМассив по возрастанию
Возвращает новый массив в порядке возрастания
Метод sort() изменит исходный массив, который по умолчанию отсортирован по коду юникода.
ascArr(array)
параметр
-
arrayотсортированный массив для проверки
Пример
ascArr([3, 2, 3, 4, 1])
// => [ 1, 2, 3, 3, 4 ]
исходный код
descArrМассив по убыванию
Возвращает новый массив в порядке убывания
descArr(array)
параметр
-
arrayотсортированный массив для проверки
Пример
descArr([3, 2, 3, 4, 1])
// => [ 1, 2, 3, 3, 4 ]
исходный код
shuffleслучайный порядок
Чтобы создать случайный массив, используйтеFisher-YatesАлгоритм случайной сортировки элементов массива
shuffle(array)
параметр
-
arrayмассив должен быть случайным
Пример
shuffle([2, 3, 1])
// => [3, 1, 2]
исходный код
takeArrayПерехватить элемент, указанный в начале массива
Извлечь n элементов из самого первого элемента массива
takeArray(array, n)
параметр
-
arrayМассив для извлечения. -
n=элемент для извлеченияnномер.
Пример
takeArray([2, 3, 1], 2)
// => [2, 3]
исходный код
takeLastArrayобрезать последний указанный элемент массива
Извлечь n элементов, начиная с последнего элемента массива
takeLastArray(array, n)
параметр
-
arrayМассив для извлечения. -
n=элемент для извлеченияnномер.
Пример
takeLastArray([2, 3, 1], 2)
// => [3, 1]
исходный код
cloneArrayмассив клонов
Неглубокое копирование копии массива
cloneArray(array)
параметр
-
arrayмассив для копирования
Пример
cloneArray([1, 24])
// => [1, 24]
исходный код
maxArrayсамое большое значение в массиве
Отфильтруйте все неложные элементы в исходном массиве и верните максимальное значение в массиве.
maxArray(array)
параметр
-
arrayмассив для обработки
Пример
maxArray([0, -1, -2, -3, false])
// => 0
исходный код
minArrayнаименьшее значение в массиве
Отфильтруйте все неложные элементы в исходном массиве и верните минимальное значение в массиве.
minArray(array)
параметр
-
arrayмассив для обработки
Пример
minArray([0, -1, -2, -3, false])
// => -3
исходный код
validArrayУдалить недопустимые значения из массива
Создает новый массив, содержащий все неложные элементы исходного массива. Напримерfalse, null,0, "", undefined, иNaNсчитаются «ложными значениями».
validArray(array)
параметр
-
arrayмассив для обработки
Пример
minArray([0, 1, false, 2, '', 3])
// => [1, 2, 3]
исходный код
filterParamsУдалить неверные значения из параметров запроса
Создайте новый параметр запроса, содержащий все недопустимые элементы значения в исходном параметре запроса. Например,null, "", undefined, иNaNОба считаются «недопустимыми значениями».
filterParams(obj)
параметр
-
objожидающие параметры запроса
Пример
const params = {
a:1,
b: '2',
c: null,
d: '',
e: undefined,
f: NaN,
}
filterParams(params)
// => {a: 1, b: '2'}
исходный код
2. Объект
cloneObjectклонировать объект
Неглубокое копирование копии объекта
cloneObject(object)
параметр
-
objectобъект для копирования
Пример
const a = { x: 1, y: 1 }
const b = cloneObject(a)
// => a !== b
исходный код
3. Функция
debounceФункция защиты от тряски
Обратный вызов выполняется через n секунд после запуска события, и если он снова запускается в течение этих n секунд, таймер переустанавливается.
debounce(fn, wait)
параметр
-
fnфункция устранения дребезга -
wait=500миллисекунды для задержки
Пример
debounce(()=> { console.log('debounce') }, 1000)
// => 1秒后打印'debounce'
исходный код
throttleрегулирование функции
Укажите единицу времени. В этой единице времени функция обратного вызова, запускающая событие, может быть выполнена только один раз. Если событие инициируется несколько раз в одну и ту же единицу времени, только одно из них может вступить в силу.
throttle(fn, wait)
параметр
-
fnфункция дросселирования -
wait=500миллисекунды для задержки
Пример
throttle(() => {
console.log('throttle')
}, 1000)
// 1秒多次触发打印一次`throttle`
исходный код
typeFnТиповое суждение
определитьArray Object String Numberтип
typeFn.type(value)
параметр
-
typeтип данных -
valueзначение для проверки
Пример
typeFn.String('1')
typeFn.Number(1)
typeFn.Boolean(false)
typeFn.Null(null)
typeFn.Array([1, 2])
typeFn.Object({ a: 1 })
typeFn.Function(() => {})
// => true
исходный код
calcFnСложение, вычитание, умножение и деление
Поскольку JavaScript следует математическому стандарту IEEE 754, он работает с 64-битными числами с плавающей запятой. Потеря точности при выполнении десятичной арифметики.
calcFn.add(value1, value2, value3)
параметр
-
add,sub,mul,divоператор -
valueзначение для расчета
Пример
解决 0.1+0.2 !== 0.3 问题
//加法
calcFn.add(0.1, 0.2) // 0.3
//减法
calcFn.sub(0.1, 0.2) // 0.1
//乘法
calcFn.mul(0.2, 0.3) // 0.06
// 乘法
calcFn.div(0.1, 0.2) // 0.5
исходный код
4. Строка
isNilЯвляется ли значениеnullилиundefined
isNil(value)
параметр
-
valueзначение для проверки
Пример
isNil(null)
isNil(undefined)
// => true
исходный код
padStartзамаскировать строку
padStart(value, n, maskChar)
параметр
-
valueчтобы замаскировать строку -
n = 4длина набивки -
maskCharсимволы-заполнители
Пример
padStart('18659808664')
// => 1865*******
исходный код
5. Числа
thousandsЧисла с точкой с запятой через каждые три цифры
thousands(number)
параметр
-
numberчисло или число с плавающей запятой
Пример
thousands(12255552323)
// => 12,255,552,323
thousands(592535.2641)
// => 592,535.2641
исходный код
numPercentageПреобразовать десятичную дробь в проценты
numPercentage(number,digit)
параметр
-
numberдесятичный -
digitзарезервированные биты
Пример
numPercentage(12.655566, 3)
// => 1265.557%
исходный код
randomNumberслучайные целые числа в указанном диапазоне
randomNumber(min, max)
параметр
-
minУкажите минимальное значение диапазона -
maxУкажите максимальное значение диапазона
Пример
randomNumber(0, 10)
// => 7
// => 2
исходный код
averageсредний
average(value1, value2, value3)
параметр
-
valueномер
Пример
average(...[1, 2, 3])
average(1, 2, 3)
// => 2
исходный код
averageByНайдите среднее значение объекта в объекте массива
averageBy(array, fn)
параметр
-
arrayмассив для итерации -
fnитерационная функция
Пример
averageBy([{ n: 4 }, { n: 2 }, { n: 8 }, { n: 6 }], o => o.n)
averageBy([{ n: 4 }, { n: 2 }, { n: 8 }, { n: 6 }], 'n')
// => 5
исходный код
aboutEqualЯвляются ли два значения приблизительно равными
Если входящие два числа примерно равны, ошибка находится в допустимом диапазоне
aboutEqual(n1, n2, epsilon)
параметр
-
n1 n2цифры для сравнения -
epsilonОшибка находится в допустимом диапазоне
Пример
aboutEqual(25, 2, 0.06)
// => false
исходный код
getLineSizeВычислить расстояние между двумя точками
Теорема Пифагора для вычисления расстояния между двумя точками
getLineSize = (x1, y1, x2, y2)
параметр
-
x1 y1 x2 y2Координатные точки
Пример
getLineSize(0, 0, 3, 4)
// => 5
исходный код
sumсумма значений в массиве
sum(value1, value2, value3)
параметр
-
value1 value2 value3числа для повторения
Пример
sum(1, 2, 3, 4)
sum(...[1, 2, 3, 4])
// => 10
исходный код
6. Браузер
copyTextКопировать текст H5
copyText(content, callback)
параметр
-
contentскопировать текст -
callbackПодсказка обратного вызова пользователя
Пример
copyText(content, text => {
this.$toast(text)
})
исходный код
getCurrentURLПолучить текущий URL-адрес
Эта функция возвращает URL-адрес текущей страницы.
Пример
getCurrentURL()
// => "https://juejin.cn"
исходный код
scrollToTopBack to top
Плавная прокрутка к началу текущей страницы.
Пример
scrollToTop()
// => 当前页面的顶部
исходный код
smoothScrollПлавная прокрутка страниц
Плавная прокрутка в видимую область окна браузера
Пример
smoothScroll('#fooBar');
// => 平滑滚动到ID为fooBar的元素
smoothScroll ('.fooBar' );
// => 使用fooBar类平滑滚动到第一个元素
исходный код
5.isCurrentPageЭто текущая страница
Является ли вкладка браузера просматриваемой пользователем
Пример
isCurrentPage()
// => true
исходный код
7. Окружающая среда
1.isBrowserЭто браузер
Возвращает, является ли текущая среда выполнения браузером
Пример
isBrowser()
// => true (browser)
// => false (Node)
исходный код
2.isWechatBrowserСудя по браузеру WeChat или обычному h5
Пример
isWechatBrowser()
// => true
исходный код
3.isMobileОпределить, является ли это мобильным терминалом
Пример
isMobile()
// => true
исходный код
8. Другие
after
Этот метод создает функцию, когда он вызываетсяnили несколько раз сработает сразу послеfunc
after(n, func)
параметр
-
n(number):funcСколько раз метод должен быть вызван перед выполнением. -
func(Функция): функция, используемая для уточнения.
возвращение
(Функция): возвращает новую квалифицированную функцию.
Пример
const saves = ['profile', 'settings']
const done = after(saves.length, () => console.log('done saving!'))
forEach(saves, type => asyncSave({ 'type': type, 'complete': done }))
// => 打印 'done saving!' 在两个异步保存完成后。
исходный код
const after = (n, func) =>{
if (typeof func !== 'function') {
throw new TypeError('Expected a function');
};
n = n || 0;
return (...args) => {
if (--n < 1) {
return func.apply(this, args);
};
};
};
before
создать звонокfuncфункция, поthisПривязка и создание вызовов параметров к функциямfunc, количество обращений не превышаетnВторосортный. Вызов этой функции позже вернет последний вызовfuncрезультат.
before(n, func)
параметр
-
n(число): сколько раз больше не звонитьfunc(Примечание: ограничьте количество звонковfuncколичество раз). -
func(Функция): Функция, которая ограничивает выполнение.
возвращение
(Функция): возвращает новую квалифицированную функцию.
Пример
jQuery(element).on('click', _.before(5, addContactToList));
// => 最多只允许点击4次
исходный код
const before = (n, func) => {
let result;
if (typeof func !== 'function') {
throw new TypeError('Expected a function');
};
return function (...args) {
if (--n > 0) {
result = func.apply(this, args);
};
if (n <= 1) {
func = undefined;
};
return result;
};
};
castArray
создать звонокfuncфункция, поthisПривязка и создание вызовов параметров к функциямfunc, количество обращений не превышаетnВторосортный. Вызов этой функции позже вернет последний вызовfuncрезультат.
castArray(value)
параметр
-
value(*): значение для обработки.
возвращение
(Массив): возвращает преобразованный массив.
Пример
castArray(1);
// => [1]
castArray({ 'a': 1 });
// => [{ 'a': 1 }]
castArray('abc');
// => ['abc']
castArray(null);
// => [null]
castArray(undefined);
// => [undefined]
castArray();
// => []
const array = [1, 2, 3];
console.log(castArray(array) === array);
// => true
исходный код
const castArray = (...args) => {
if (!args.length) {
return [];
};
const value = args[0];
return Array.isArray(value) ? value : [value];
};
clamp
Возврат ограниченlowerиupperЗначение между.
clamp(number, [lower], upper)
параметр
-
number(число): значение, которое нужно ограничить. -
[lower](число): Нижняя граница. -
upper(число): верхний предел.
возвращение
(число): возвращает ограниченное значение.
Пример
clamp(-10, -5, 5);
// => -5
clamp(10, -5, 5);
// => 5
исходный код
const clamp = (number, lower, upper) => {
number = +number;
lower = +lower;
upper = +upper;
lower = lower === lower ? lower : 0;
upper = upper === upper ? upper : 0;
if (number === number) {
number = number <= upper ? number : upper;
number = number >= lower ? number : lower;
};
return number;
};
compact
Создает новый массив, содержащий все неложные элементы исходного массива. Напримерfalse, null,0, "",undefined, иNaNсчитаются «ложными значениями».
compact(array)
параметр
-
array(Массив): Массив для обработки
возвращение
(Массив): возвращает новый массив с отфильтрованными ложными значениями.
Пример
compact([0, 1, false, 2, '', 3]);
// => [1, 2, 3]
исходный код
const compact = (array) => {
let resIndex = 0;
const result = [];
if (array == null) {
return result;
};
for (const value of array) {
if (value) {
result[resIndex++] = value;
};
};
return result;
};
create
создать наследствоprototypeОбъект. если предусмотреноprototype, перечисляемые свойства которого присваиваются созданному объекту.
create(prototype, [properties])
параметр
-
prototype(Объект): объект для наследования. -
[properties](Объект): свойство для назначения.
возвращение
(Объект): возвращает новый объект.
Пример
function Shape() {
this.x = 0;
this.y = 0;
}
function Circle() {
Shape.call(this);
}
Circle.prototype = create(Shape.prototype, {
'constructor': Circle
});
let circle = new Circle;
circle instanceof Circle;
// => true
circle instanceof Shape;
// => true
исходный код
const create = (prototype, properties) => {
prototype = prototype === null ? null : Object(prototype);
const result = Object.create(prototype);
return properties == null ? result : Object.assign(result, properties);
};
defaultTo
экзаменvalue, чтобы определить, следует ли возвращать значение по умолчанию. еслиvalueзаNaN, null, илиundefined, затем вернутьсяdefaultValueПо умолчанию.
defaultTo(value, defaultValue)
параметр
-
value(*): значение для проверки. -
defaultValue(*): значения по умолчанию.
возвращение
(*): возвращает разрешенное значение.
Пример
defaultTo(1, 10);
// => 1
defaultTo(undefined, 10);
// => 10
исходный код
const defaultTo = (value, defaultValue) => {
return (value == null || value !== value) ? defaultValue : value;
};
defer
отложить вызовfunc, пока текущий стек не будет очищен. При вызове любые дополнительные параметры передаются вfunc.
defer(func, [args])
параметр
-
func(Функция): функция задержки. -
[args](...*): аргументы, которые будут переданы функции func при ее вызове.
возвращение
(число): возвращает идентификатор таймера.
Пример
defer(function(text) {
console.log(text);
}, 'deferred');
// => 一毫秒或更久一些输出 'deferred'。
исходный код
const defer = (func, ...args) => {
if (typeof func !== 'function') {
throw new TypeError('Expected a function');
};
return setTimeout(func, 1, ...args);
};
delay
ЗадерживатьwaitВызывается через миллисекундыfunc. При вызове любые дополнительные параметры передаются вfunc.
delay(func, wait, [args])
параметр
-
func(Функция): функция задержки. -
wait(число): количество миллисекунд для задержки. -
[args](...*): будет передано при вызовеfuncпараметр.
возвращение
(число): возвращает идентификатор таймера
Пример
delay(function(text) {
console.log(text);
}, 1000, 'later');
// => 一秒后输出 'later'。
исходный код
const delay = (func, wait, ...args) => {
if (typeof func !== 'function') {
throw new TypeError('Expected a function');
};
return setTimeout(func, +wait || 0, ...args);
};
endsWith
проверить строкуstringли данныйtargetконец строки.
endsWith([string=''], [target], [position=string.length])
параметр
-
[string=''](строка): строка для извлечения. -
[target](строка): символ для извлечения. -
[position=string.length](число): позиция для извлечения.
возвращение
(логическое): если строкаstringотtargetконец строки, затем возвратtrue, иначе возвратfalse.
Пример
endsWith('abc', 'c');
// => true
endsWith('abc', 'b');
// => false
endsWith('abc', 'b', 2);
// => true
исходный код
const endsWith = (string, target, position) => {
const { length } = string;
position = position === undefined ? length : +position;
if (position < 0 || position != position) {
position = 0;
} else if (position > length) {
position = length;
};
const end = position;
position -= target.length;
return position >= 0 && string.slice(position, end) == target;
};
eq
воплощать в жизньSameValueZeroСравните два значения, чтобы увидеть, равны ли они.
eq(value, other)
параметр
-
value(*): значение для сравнения. -
other(*): Другое значение для сравнения.
возвращение
(логическое): возврат, если два значения равныtrue, иначе возвратfalse.
Пример
let object = { 'a': 1 };
let other = { 'a': 1 };
eq(object, object);
// => true
eq(object, other);
// => false
eq('a', 'a');
// => true
eq('a', Object('a'));
// => false
eq(NaN, NaN);
// => true
исходный код
const eq = (value, other) => {
return value === other || (value !== value && other !== other);
};