欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

js使用遇到过的 几个小技巧

程序员文章站 2024-02-19 12:32:04
...

1、过滤唯一值
Set类型是在ES6中新增的,它类似于数组,但是成员的值都是唯一的,没有重复的值。结合扩展运算符(…)我们可以创建一个新的数组,达到过滤原数组重复值的功能。这个技巧的适用范围是数组中的数值的类型为:undefined, null, boolean, string, number

const array = [1, 2, 3, 3, 5, 5, 1];
const uniqueArray = [...new Set(array)];

console.log(uniqueArray); // [1, 2, 3, 5]
//见过的面试题
//已知如下数组:var arr = [ [1, 2, 2], [3, 4, 5, 5], [6, 7, 8, 9, [11, 12, [12, 13, [14] ] ] ], 10];编写一个程序将数组扁平化去并除其中重复部分数据,最终得到一个升序且不重复的数组
//做法:[...new Set(arr.flat(Infinity)))].sort((a,b)=>{ return a-b}

2、短路求值(Short-Circuit Evaluation)
与(&&)运算符将会返回第一个false/‘falsy’的值。当所有的操作数都是true时,将返回最后一个表达式的结果。

let one = 1, two = 2, three = 3;
console.log(one && two && three); // Result: 3

console.log(0 && null); // Result: 0

或(||)运算符将返回第一个true/‘truthy’的值。当所有的操作数都是false时,将返回最后一个表达式的结果。

let one = 1, two = 2, three = 3;
console.log(one || two || three); // Result: 1

console.log(0 || null); // Result: null

3、快速求幂
// 下面几种写法是等价的
Math.pow(2, n);
2 << (n - 1);
2**n; ES7写法

4、快速Float转Integer
我们平时可以使用Math.floor(), Math.ceil()和Math.round()将float类型转换成integer类型。
但是还有一种更快的方法可以使用|(位或运算符)将浮点数截断为整数。
console.log(23.9 | 0); // Result: 23
console.log(-23.9 | 0); // Result: -23
或者
var a = ~~2.33; //2

var c = 2.33>>0; //2

5、截取数组
如果你知道原始数组的长度,就可以通过重新定义它的length属性来实现截取。
let array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
array.length = 4;
console.log(array); // Result: [0, 1, 2, 3]
这是一个特别简洁的解决方案。但是,slice()方法的运行时更快。如果速度是你的主要目标,考虑使用下面的方式。
let array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
array = array.slice(0, 4);

console.log(array); // Result: [0, 1, 2, 3]

6、取数组最大值
数组dataArr = [2,5,7,8,5]
Math.max.apply(Math, dataArr)

ES6写法:Math.max(…dataArr)

7、删除前后空格

String.prototype.trim = function () { return this.replace(/(^[ | ]*)|([ | ]*$)/g, ""); }

8、合并数组

var mergeTo = [4,5,6];
var mergeFrom = [7,8,9];
Array.prototype.push.apply(mergeTo, mergeFrom);
mergeTo; // is: [4, 5, 6, 7, 8, 9]

或者

var mergeTo = [4,5,6];
var mergeFrom = [7,8,9];

mergeTo = […mergeTo, …mergeFrom ]

9、如何最佳让两个整数交换数值

var a = 1;

var b = 2;

a^=b;

b^=a;

a^=b;

//a = 2, b = 1

10、arguments对象
无需写参
function name(){

return arguments[0];//获取参数的个数用arguments.length

}

console.log(name(“刘德华”)); //输出"刘德华"

11、Function构造函数接受的参数中,第一个是要传入的参数名,第二个是函数内的代码
这种方式可以根据传入字符串内容来创建一个函数

var add = new Function("a","a = a+10;return a;");

console.log(add(123));   //输出:133