Все виды развития бизнеса неотделимы от обработки данных, но многие из встречающихся данных сложны в обработке. В это время вам необходимо обратиться за помощью к поисковым системам. Этот метод очень неэффективен, и, судя по личности автора, нет гарантии собственного вкуса. Поэтому этот текст содержит руководство по общим бизнес-функциям JS, таким как обработка формата времени, используемый браузер мобильного телефона, проверка номера мобильного телефона и адреса электронной почты, чтобы повысить эффективность вашей разработки.
Часто используемые JS-функции
1. Форматирование времени
Время, отображаемое в интерфейсе, постоянно меняется, поэтому функция, работающая со временем, очевидна.
export function formatDate (oldDate, fmt) {
let date = new Date()
if (typeof oldDate === 'string' || typeof oldDate === 'number') {
date = new Date(+oldDate)
} else {
date = oldDate
}
if (/(y+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length)) }
let o = {
'M+': date.getMonth() + 1,
'd+': date.getDate(),
'h+': date.getHours(),
'm+': date.getMinutes(),
's+': date.getSeconds() }
function padLeftZero (str) {
return ('00' + str).substr(str.length)
}
for (let k in o) {
if (new RegExp(`(${k})`).test(fmt)) {
let str = o[k] + ''
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? str : padLeftZero(str))
}
}
return fmt
}
ФорматированиеDate принимает два параметра, тип Olddate можно получить дату, строку, номер. Потому что это действительно довольно много времени доставки времени доставки, это также очень удобно, а JS - это слабый тип языка, поэтому я сделаю данные строки и цифры номера, объединяемые для Do Timestamp. FMT является форматированным типом: yyyy-mm-dd HH: мм, где гггг | мм | дд | hh | mm - это ключевое слово, которое соответствует году | месяц | японский | Среди них персонажи могут быть заменены на волю, и только другие ключевые слова могут быть удалены. Несколько примеров:
-
гггг ММ месяц дд -> 7 сентября 2019 г.
-
чч минуты мм секунды -> 16 минут 53 секунды
2. Получите метку времени ответа в «днях».
Обычно время три дня назад, данные в течение 12 и данные в течение 24 часов получаются, поэтому я сделал функцию для получения метки времени в днях
export function setDate(num) { return Date.now() + num * 24 * 60 * 60 * 1000}
Положительное время может получить будущее время, отрицательное время может получить прошедшее время. Например
-
время 12 часов назад -> setDate(-.5)
-
время 24 часа назад -> setDate(-1)
-
время через три дня -> setDate(3)
3. Получите параметры в URL
Кажется, что это требование мало используется в эпоху трех основных фреймворков, но вопросов в интервью все еще довольно много, и это полезно знать.
Простая реализация
var urlParams = new URLSearchParams('?post=1234&action=edit');
console.log(urlParams.get('action')); // "edit"
Я взглянул на поддержку браузера, и это довольно хорошо, за исключением зла, т.е.
комплексная реализация
function getUrlParams(param){
// 有赖于浏览器环境， window.location.search 是浏览器函数
// 意思是:设置或返回从问号 (?) 开始的 URL（查询部分）。
var query = window.location.search.substring(1);
var vars = query.split("&");
for (var i=0;i<vars.length;i++) {
var pair = vars[i].split("=");
if(pair[0] == param){return pair[1];}
}
return(false);
}
Например:xuyuechao.top?a=3&b=5&c=8888
-
getUrlParams('a') -> 3
-
getUrlParams('b') -> 5
-
getUrlParams('c') -> 8888
4. Мобильный терминал определяет тип браузера
BrowserInfo = {
isAndroid: Boolean(navigator.userAgent.match(/android/ig)),
isIphone: Boolean(navigator.userAgent.match(/iphone|ipod/ig)),
isIpad: Boolean(navigator.userAgent.match(/ipad/ig)),
isWeixin: Boolean(navigator.userAgent.match(/MicroMessenger/ig)),
isAli: Boolean(navigator.userAgent.match(/AlipayClient/ig)),
isPhone: Boolean(/(iPhone|iPad|iPod|iOS|Android)/i.test(navigator.userAgent))
}
В настоящее время он в основном поддерживает Android, Apple, iPad, WeChat и Alipay, а также мобильный телефон или нет.
5. Уменьшение размерности массива
Двумерный массив
let arr = [ [1], [2], [3] ]
arr = Array.prototype.concat.apply([], arr); // [1, 2, 3]
Уменьшение размерности многомерного массива
let arr = [1, 2, [3], [[4]]]
arr = arr.flat(3) // [1, 2, 3, 4]
У Flat есть проблемы с совместимостью, не так много на мобильных телефонах. Сторона браузера несовместима с Edge. Fill Infinity для расширения массива любой глубины
6. Глубокое копирование
Используя переменную a для копирования объекта b, изменение значения в a также изменит значение в b. Это называется поверхностной копией. Чтобы сделать a независимым от b, требуется глубокая копия
простота в обращении
function deepClone() {
return JSON.parse(JSON.stringify(obj))
}
Поскольку это простая обработка, у нее есть свои недостатки.Вышеупомянутое в основном использует сериализацию и десериализацию JSON. JSON не поддерживает функции и неопределенность, поэтому в этих случаях он будет отсутствовать, но в большинстве случаев он подходит.
комплексная обработка
Сложная обработка требует рекурсии
function deepClone(obj) {
function isClass(o) {
if (o === null) return "Null";
if (o === undefined) return "Undefined";
return Object.prototype.toString.call(o).slice(8, -1);
}
var result;
var oClass = isClass(obj);
if (oClass === "Object") {
result = {};
} else if (oClass === "Array") {
result = [];
} else {
return obj;
}
for (var key in obj) {
var copy = obj[key];
if (isClass(copy) == "Object") {
result[key] = arguments.callee(copy);//递归调用
} else if (isClass(copy) == "Array") {
result[key] = arguments.callee(copy);
} else {
result[key] = obj[key];
}
}
return result;
}
7. Защита от сотрясений и дросселирование
Anti-shake и throttling — это навыки высокого уровня, и чаще всего в бизнесе приходится искать оперативную информацию об изменении контента. Даже если вы не добавите его, вы не сможете увидеть разницу, но если вы добавите код обслуживания новичка, вы можете обожать вас.
Стабилизатор
function debounce(func, wait) {
let timeout;
return function () {
let context = this;
let args = arguments;
if (timeout) clearTimeout(timeout);
timeout = setTimeout(() => {
func.apply(context, args)
}, wait);
}
}
дросселирование
function throttle(func, wait) {
let previous = 0;
return function() {
let now = Date.now();
let context = this;
let args = arguments;
if (now - previous > wait) {
func.apply(context, args);
previous = now;
}
}
}
8. Получить экстремумы массива
function smallest(array){
return Math.min.apply(Math, array);
}
function largest(array){
return Math.max.apply(Math, array);
}
smallest([0, 1, 2.2, 3.3]); // 0
largest([0, 1, 2.2, 3.3]); // 3.3
Спасибо за комментарий бестеневых лет, а потом добавить метод реализации es6
let list = [1, 2, 3, 4, 5]
Math.max(...list) // 5
Math.min(...list) // 1
9. Определить, равны ли десятичные дроби
function epsEqu(x,y) {
return Math.abs(x - y) < Math.pow(2, -52);
}
// 举例
0.1 + 0.2 === 0.3 // false
epsEqu(0.1 + 0.2, 0.3) // true
благодарный IAmFineThanksПредоставлено Number.EPSILON , Number.EPSILON === Math.pow(2, -52), поэтому приведенный выше метод также можно записать следующим образом.
function epsEqu(x,y) {
return Math.abs(x - y) < Number.EPSILON;
}
Пользователь вводит десятичное число, а компьютер сохраняет двоичное число. Следовательно, результаты вычислений будут смещены, поэтому мы не должны напрямую сравнивать нецелые числа, а брать верхний предел и вычислять ошибку. Такая верхняя граница называется машинным эпсилоном, а стандартное значение эпсилон для двойной точности равно 2^-53 (Math.pow(2, -53))
Суммировать:
Код в статье не обязательно является оптимальным кодом, если у вас есть лучший код, пожалуйста, прокомментируйте.
Использованная литература:
Woohoo.Краткое описание.com/afraid/from 8 не 86 не 09…
woo woo woo.cn blog on.com/Я хочу сладкий картофель/боюсь/…
рок-метал.just.org/2017/02/15/…
Несколько трюков, чтобы сделать JS более элегантным/читабельным
Для инженеров код — это важный результат написания кода один раз, многократного его изменения и повторного чтения Читаемость очень важна, поэтому важность хорошо читаемого кода очевидна.
1. Используйте объекты вместо переключателя/если
公共内容:
let a = 'VIP'
场景 1
if (a === 'VIP') {
return 1
} else if (a === 'SVIP') {
return 2
}
场景 2
switch(a) { // 感谢 红山老六 的评论指出这部分代码的 bug。现已改正
case 'VIP':
return 1
case 'SVIP':
return 2
}
场景 3
let obj = {
VIP: 1,
SVIP: 2
}
Это всего лишь метод, и конкретный сценарий использования все еще зависит от вас. Один из сценариев, который я использую больше, — это китайское значение сопоставления состояния, Например, состояние оплаты обычно получает значения 1, 2, 3 и 4, но в списке требуется отобразить соответствующее китайское состояние Неоплачено | Оплата | Возврат средств и т. д. Подождите
2. Использование || и &&
// 场景 1
function b(a) {
if (a) {
return a
} else {
return ''
}
}
// 场景 2
function b(a) {
return a || ''
}
Вышеупомянутое использование ||, также известное как обработка короткого замыкания. Обычно используется в условиях if, но также может использоваться непосредственно в операторах. Когда первый параметр имеет значение true, он принимает значение первого параметра, а когда первый параметр не соответствует истине, он принимает значение второго параметра. && является полной противоположностью ||. Если первый параметр истинен, он примет значение второго параметра
Суммировать
Эта часть думает только о двух, и пространство для оптимизации довольно велико. Я надеюсь, что разносторонние пользователи сети прокомментировали и внесли предложения, чтобы сделать статью чрезвычайно сильной.
Полный текст резюме
Я чувствую, что сортировка и обобщение знаний улучшились на шаг, и в то же время я могу работать меньше сверхурочно. Незаметно прошел месяц и я написал четыре статьи для повышения эффективности разработки программирования.Также в статьях много недочетов.Для удобства последующего обсуждения всех вы можете добавить меня в WeChat и привести в группу.Давайте обсудим и исследования вместе, счастливого взросления.