Java教程

前端实用的 JavaScript 代码片段分享

本文主要是介绍前端实用的 JavaScript 代码片段分享,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

本篇文章给大家分享个前端常用的JS代码片段。希望可以帮助到大家~~~

1、获取数组中的最大值和最小值

var arr = [1, 2, 3];var max = Math.max(...arr);//3var min = Math.min(...arr);//1

2、将字符串拆分成数组

① 使用split()方法

var str="Welcome";var n=str.split("");
console.log(n);

输出:

["W","e","l","c","o","m","e"]

 ② 使用Array.from()方法

Array.from()方法是javascript中的一个内置函数,它从给定的数组创建一个新的数组实例。对于字符串,字符串的每个字母表都会转换为新数组实例的元素;对于整数值,新数组实例将获取给定数组的元素。

var str="Welcome";var n=Array.from(str);console.log(n);

输出:

["W","e","l","c","o","m","e"]

 ③ 使用扩展运算符

var str="Welcome";var n=[...str];console.log(n);

输出:

["W","e","l","c","o","m","e"]

3、三元操作符

当想写if...else语句时,使用三元操作符来代替。

const x = 20;let str;if (x > 10) {   str = '1';
} else {   str = '2';
}

简写:

const str = x > 10 ? '1' : '2';

4、声明变量简写方法

let x;let y;let z;

简写方法:

let x, y, z=1;

5、判断数组中的元素是否都相等

const allEqual = arr => arr.every(val => val === arr[0]);allEqual([1, 2, 3); // falseallEqual([1, 1, 1]); // true

6、数组去重

① 利用ES6 的Set

function unique(arr) {   return [...new Set([3,4,4,4,4,5])]
}console.log(unique(arr));

简写方法:

var unique = (a) => [...new Set([3,4,4,4,4,5])];console.log(unique);

输出:

[3,4,5]

② 利用filter

var array = [3,4,4,4,4,5]; 
function unique(array) { 
var res = array.filter(function(item, index, array){ 
return array.indexOf(item) === index; 
}) 
return res; 
} 
console.log(unique(array));

输出:

[3,4,5]

③ 利用sort

先对数组进行排序sort(),排好序,然后把数组的当前项和后一项进行比较,相同则使用数组的splice(相同的位置,1),但是为了防止数组塌陷,每次删除数组元素的时候要把i的值减一。

 var ary = [3,4,4,4,4,5];
 ary.sort(function(a,b){ 
return a-b; 
});//返回的是排好序的数组 for(var i=0;i<ary.length;i++){ if(ary[i]===ary[i+1]) 
{ 
ary.splice(i,1); i--;//为了防止数组塌陷 } 
}

7、循环简写

for (let i = 0; i < arr.length; i++)

简写:

for (let index in arr)

或:

function logArrElements(element, index, array) {  console.log("a[" + index + "] = " + element);
}
arr.forEach(logArrElements);

8、将类数组转换为数组

export const formArray = (arrO) => {    var arr = [];    if (Array.isArray(arrO)) {
        arr = arrO;
    } else {
        arr = Array.prototype.slice.call(arrO);
    };    return arr;
}

9、数字类型判断

export const isNumber = (o) => {    return Object.prototype.toString.call(o).slice(8, -1) === 'Number'}

10、判断null

export const isNull = (o) => {    return Object.prototype.toString.call(o).slice(8, -1) === 'Null'}

  

内容如果有错,欢迎纠正 ~~~


这篇关于前端实用的 JavaScript 代码片段分享的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!