跳至主要內容
基础的js树的遍历

可直接复制代码到浏览器查看效果

const dataList = [
    {
        name:"a",
        children:[
            {
                name:"a-1",
                children:[
                    { name:"a-1-1" },
                    { name:"a-1-2" },
                ]
            },
            {
                name:"a-2",
                children:[
                    {name:"a-2-1"},
                    {name:"a-2-2"}
                ]
            }
        ]
    },{
        name:"b",
        children:[
            {
                name:"b-1",
                children:[
                    { name:"b-1-1" },
                    { name:"b-1-2" },
                ]
            },
            {
                name:"b-2",
                children:[
                    {name:"b-2-1"},
                    {name:"b-2-2"}
                ]
            }
        ]
    }
];

/**
 *深度优先递归
 */
(function deepFirst(list){
    list.forEach(item=>{
        console.log(item.name);
        if(item.children) deepFirst(item.children)
    })
})(dataList);

/**
 * 深度优先非递归
 */
(function(list){
    let queue = list;
    while (queue.length >0){
        const item = list.shift();
        console.log(item.name);
        if(item.children){
            item.children.reverse();
            item.children.forEach(child=>{
                queue.unshift(child);
            })
        }

    }
})(JSON.parse(JSON.stringify(dataList)));

/**
 * 广度优先递归
 */
(function wideFirst(list){
    let children = [];
    list.forEach(item=>{
        console.log(item.name);
        if(item.children){
            children = children.concat(item.children);
        }
    })
    if(children.length>0) wideFirst(children);
})(dataList);

/**
 * 广度优先非递归
 */
(function(list){
    const queue = list;
    while (queue.length){
        const item = queue.shift();
        console.log(item.name);
        if(item.children){
            item.children.forEach(child=>{
                queue.push(child)
            })
        }
    }
})(JSON.parse(JSON.stringify(dataList)));


YueHui...小于 1 分钟javascriptjavascript
javascript Symbols

Symbols 是最新的js原始类型,它带来了一些好处,尤其上司当做对象属性时特别有用。但是它提供的什么是String做不到的呢?

在我们开始深入了解Symbols之前让我们先来看看有哪些细节是开发者们不太容易注意到的。

背景

在js中有两种数据类型,原始类型和引用数据类型(原文这里用的objects); 原始类型包括numbers(包括整数,浮点数,Infinity,NaN),布尔值,字符串,undefined,还有null(虽然 typeof null === 'object'null仍然是一个原始类型)


YueHui...大约 9 分钟javascriptjavascriptsymbol
常用的正则表达式
  • 匹配任意字符: [\s\S]
  • 纯数字: ^[0-9]*$
  • n位数字: ^\d{n}$
  • 至少n位数字: ^\d{n,}$
  • m-n位数字: ^\d{m,n}$
  • 长度为n的字符: .{3}$
  • 纯汉字: ^[\u4e00-\u9fa5]{0,}$
  • 匹配电话号码: ("^(\d{3,4}-)\d{7,8}$") 格式:xxx/xxxx-xxxxxxx/xxxxxxxx
  • 匹配手机号码(包含虚拟号码和新号码段): ^1([38][0-9]|4[5-9]|5[0-3,5-9]|66|7[0-8]|9[89])[0-9]{8}$
  • 匹配Email地址: ^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$
  • 匹配html标签: <(\S*?)[^>]*>.*?</>|<.*? />
  • 匹配ip地址: ([1-9]{1,3}\.){3}[1-9]

YueHui...小于 1 分钟javascriptjavascript正则表达式