JavaScript问题清单与经验

Posted 2022-06-30 web半晨

目录

• 1、正则匹配索引、RegExp、matchAll、reduce、concat、toString、split、includes、String
• 2、数组、类数组、字符串新方法at、arguments
• 3、监测循环时间、检测、时常、计时、性能、time、timeEnd、for
• 4、数组截断、length
• 5、获取字符串最后一个字符、charAt、substr、split、replace、at
• 6、数组翻转、push、isArray、reverse

---

1、正则匹配索引、RegExp、matchAll、reduce、concat、toString、split、includes、String

let str = 'The question is TO BE, or not to be, that is to be. is to do.',
	regex = /to/gd,
	arr = [...str.matchAll(regex)].reduce((pre, cur) => (pre.concat([cur.indices[0]])), []);

for (let i = 0; i < str.length; i++) if (arr.toString().split(',').includes(String(i))) console.log(str[i]);

该提案提供了一个新的d，用来获取每个匹配的开始位置和结束位置信息。

---

2、数组、类数组、字符串新方法at、arguments

let arr = [1, 2, 3, 4, 5, 6, 7],
	str = 'throw new Error();';

console.log(arr.at(-1));
// 7
console.log(arr.at(-2));
// 6
console.log(str.at(-1));
// ;
console.log(str.at(-2));
// )

TC39建议在所有基本可索引类，例如：数组、字符串、类数组（arguments）中添加at方法。at方法支持正索引和负索引。

---

3、监测循环时间、检测、时常、计时、性能、time、timeEnd、for

for循环的性能

// 启动计时器
console.time('timeRequired');
for (let i = 0; i < 9999; i++) 
    console.log('半晨');
    // 9999 半晨

// 停止计时，输出时间
console.timeEnd('timeRequired');
// timeRequired: 256.236083984375 ms

---

函数性能

function testForEach(x) 
    console.time('test-forEach');
    const res = [];
    x.forEach((value, index) => 
        res.push(value / 1.2 * 0.1);
    );

    console.timeEnd('test-forEach')
    return res;


function testFor(x) 
    console.time('test-for');
    const res = [];
    for (let i = 0; i < x.length; i++) 
        res.push(x[i] / 1.2 * 0.1);
    

    console.timeEnd('test-for')
    return res;


const x = new Array(100000).fill(Math.random());
testForEach(x);
testFor(x);

---

4、数组截断、length

let arr = [1, 3, 5, 7];
arr.length = 2;
console.log(arr);
// (2) [1, 3]

arr.length = 3;
console.log(arr);
// (3) [1, 3, empty]

let str = 'abc';
str.length = 1;
// 因为str.length = 1;没有变量存储
// new String(str).length = 1;
// 所以创建完就删除
// 最终访问的还是原始的str
// 所以str类型不能截断
console.log(str);
// abc

// 字符串有length属性是因为系统帮忙把let str = 'abc';
// 转化为 let str = new String('abc');并且加上length属性
console.log(str.length);
// 3

---

5、获取字符串最后一个字符、charAt、substr、split、replace、at

let stringVal = "web半晨";
// 方式一
console.log(stringVal.charAt(stringVal.length - 1)); // 晨
// 方式二
console.log(stringVal.substr(stringVal.length - 1, 1)); // 晨
// 方式三
console.log(stringVal.split("")[stringVal.length - 1]); // 晨
// 方式四
console.log(stringVal.replace(/^(.*[n])*.*(.|n)$/g, "$2")); // 晨
// 方式五
console.log(stringVal.substr(-1)); // 晨
// 方式六
console.log(stringVal.at(-1)); // 晨

---

6、数组翻转、push、isArray、reverse

function flips(arr = Array.isArray(arr) ? arr : []) 
    // 方式一
    let flipArr = [];
    for (let i = arr.length - 1; i > -1; i--) flipArr.push(arr[i]);
    return flipArr;

    // 方式二
    // return arr.reverse();


console.log(flips([1, 2, 3, 4, 5, 6, 7]));
// [7, 6, 5, 4, 3, 2, 1]

console.log(flips(123));
// []