JS个人笔记

前端在一串字符中取出数字的方法：

var id_num = parseInt(num.replace(/[^0-9]/ig,""))

何为json？

JSON 是 JS 对象的字符串表示法，它使用文本表示一个 JS 对象的信息，本质是一个字符串。

# JSON对象：
var obj = {a: 'Hello', b: 'World'}; //这是一个对象，注意键名也是可以使用引号包裹的
# JSON字符串：
var json = '{"a": "Hello", "b": "World"}'; //这是一个 JSON 字符串，本质是一个字符串
# JSON对象转JSON字符串：
var json = JSON.stringify({a: 'Hello', b: 'World'}); //结果是 '{"a": "Hello", "b": "World"}'
# JSON字符串转JSON对象：
var obj = JSON.parse('{"a": "Hello", "b": "World"}'); //结果是 {a: 'Hello', b: 'World'}

js中map的坑

map是js所独有的一种骚操作：

let b = [1,2,3,4,5,6,7,8]
b.map(t => {const t2 = t+2;return t2} )
// 输出：[3, 4, 5, 6, 7, 8, 9, 10]

JS实现滚动功能：

// 滚动
let scrollStep =  fetch.scrollStep; //每次滚动的步长
let scrollEnable =  fetch.scrollEnable // 是否需要启动滚动
let scrollPosition =  fetch.scrollPosition // 滚动到哪个位置
while (scrollEnable) {
    scrollEnable =  page.evaluate((scrollStep,scrollPosition) => {
        let scrollTop = document.scrollingElement.scrollTop;
        document.scrollingElement.scrollTop = scrollTop + scrollStep;
        if (scrollPosition) {
            return fetch.scrollPosition > scrollTop + 768 ? true : false
        }else{
            return document.body.clientHeight > scrollTop + 768 ? true : false
        }
    }, scrollStep,scrollPosition);
     page.waitFor(fetch.scrollTime) // 每次滚动的间隔时间
}

Js中的正则匹配

// 取出里面的字母
const a = "12312424oitett56456uuuu785843uiokmn";
const reg = /\d+/g;
// 定义一个数组用于保存匹配到信息
let result = []; 
let temp = "";
while(temp = reg.exec(a)){
   result.push(temp[0])
}

Js中的对象的常用方法

# 1.instanceof 操作符
var arr = [1,2,3,1]; 
console.log(arr instanceof Array) // true 
# 2.对象的constructor属性 
alert(arr.constructor === Array); // true 

JS中判断一个数组是否为空的办法

if(Array.prototype.isPrototypeOf(res) && res.length === 0) console.log("空数组")

JS中快速生成数组的方法：

// 生成的JSON
Array.from(new Array(10), (v,i) => { return {number: i}});
// 生成的一个0到9的数组
Array.from(new Array(10), (v,i) => return i );

JS中调用promise对象的问题

const a = () => {
    return new Promise((resolve,reject) => {
        setTimeout(() => {
            resolve(1) 
        },1000)
    })
}

const b = async () => {
    const c = await a()
    console.log(`这是结果1：${c}`)
    return c
}

// 如果需要调用b来实现调用a的话直接：
// const c = b()  这样是不行的，会得到promise[pending]
// 需要这样
const c = await b()

js 中合并两个对象的方法

// 方法一(使用jQuery)
var a = {o:123,p:234};
var b = {n:456,m:678};
var c = $.extend(a,b);      // c = {o:123,p:234,n:456,m:678}

// 方法二(使用ES6)
var c = Object.assign(a,b)  // c = {o:123,p:234,n:456,m:678}

// 方法三（使用...运算符）
var c = {...a, ...b}

// 对比Python：
a = {"yu": 12312, "nu": 34455}
b = {"a": 23, "b": 980}
c = dict(a, **b)     // c = {'yu': 12312, 'nu': 34455, 'a': 23, 'b': 980}

在一个由对象组成的列表中查找这个对象在列表中的位置

方法一(findIndex)：

const testList = [{No:1,name:'t'},{No:2,name:'n'},{No:3,name:'z'},{No:4,name:'y'}]
const step = this.testList.findIndex(e => e.No === 3)
// 输出 step : 2

方法二(map函数)：

const testList = [{No:1,name:'t'},{No:2,name:'n'},{No:3,name:'z'},{No:4,name:'y'}]
const step = testList.map(e => e.No).indexOf(3)
// 输出 step : 2

js中判断一个对象是json还是数组的方法：

a = {test:1231,test2:456}
if (a.length === undefined)  // json的length为undefined
  console.log("json")
else
  console.log("数组")

...操作的坑

今天撸Vue中遇到一个坑，来记录一下：
结论：...操作若都是操作的json，则后面的json里面的内容会替换调前面json中重名的。

a = {t:1234,o:567}
b =  {t:'kan wo',u:'test'}
{...a,...b}
// 输出
{t: "kan wo", o: 567, u: "test"}
{...b,...a}
// 输出
{t: 1234, u: "test", o: 567}

判断一个变量是否是数字：

var a = 123
var b = '123'
isNaN(a)     // true
isNaN(b)     // false