持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第12天，点击查看活动详情

题目一

已有数组:arr = [{ label: '男', value: 1 }, { label: '女', value: 0 }]

求封装一个函数,返回结果为 obj = {'1': '男'， '0': '女'}

解法一:

• 使用数组的forEach方法,
• 对象的新增属性方法 obj['属性名']=属性值

    <script>
        var arr = [{ label: '男', value: 1 }, { label: '女', value: 0 }]

        function f(arr) {
            // 写代码，得到
            let obj = {}
            arr.forEach(element => {
                obj[element.value] = element.label
            });
            return obj
        }
        var obj = f(arr);
        console.log(obj)
 // obj = {'1': '男'， '0': '女'}
    </script>

解法二

• 使用数组的reduce方法,
• 对象的新增属性方法 obj['属性名']=属性值

    <script>
        var arr = [{ label: '男', value: 1 }, { label: '女', value: 0 }]

        function f(arr) {
            // 写代码，得到
            return arr.reduce((pre, item) => {
                pre[item.value.toString()] = item.label;
                return pre
            },{})
        }
        var obj = f(arr);
        console.log(obj)
 // obj = {'1': '男'， '0': '女'}
    </script>

题目二:

已有数组: var arr2 = [{ label: '男', value: 1 }, { label: '女', value: 0 }]

求返回: arr2 = ['男', '女']

解题方法

• 返回值是一个新的数组
• 我们可以使用数组的map方法对原数组进行处理,就可以得到需要的数组

    <script>
        var arr2 = [{ label: '男', value: 1 }, { label: '女', value: 0 }]

        function f(arr) {
            // 写代码，得到
            return arr2.map((item) => {
                return item.label
            })
        }
        var arr2 = f(arr2);
        console.log(arr2)
 // arr2 = ['男', '女']
    </script>

题目三

已知一个数组有多个对象组成:

    var data = [
        { id: "01", name: "张大大", pid: "", job: "项目经理" },
        { id: "02", name: "小亮", pid: "01", job: "产品leader" },
        { id: "03", name: "小美", pid: "01", job: "UIleader" },
        { id: "04", name: "老马", pid: "01", job: "技术leader" },
        { id: "05", name: "老王", pid: "01", job: "测试leader" },
        { id: "06", name: "老李", pid: "01", job: "运维leader" },
        { id: "07", name: "小丽", pid: "02", job: "产品经理" },
        { id: "08", name: "大光", pid: "02", job: "产品经理" },
        { id: "09", name: "小高", pid: "03", job: "UI设计师" },
        { id: "10", name: "小刘", pid: "04", job: "前端工程师" },
        { id: "11", name: "小华", pid: "04", job: "后端工程师" },
        { id: "12", name: "小李", pid: "04", job: "后端工程师" },
        { id: "13", name: "小赵", pid: "05", job: "测试工程师" },
        { id: "14", name: "小强", pid: "05", job: "测试工程师" },
        { id: "15", name: "小涛", pid: "06", job: "运维工程师" }
    ]

其中

• 如果A的pid == B的id,A是B的下属
• 如果A的pid == B的pid A和B是同事

问题一: 找出 与 小刘 处于统一领导下的同事

得到的返回结果为:

[{id:"10", name: "小刘", pid:"04", job: "前端工程师"},

{id:"11", name: "小华", pid:"04", job: "后端工程师"},

{id:"12", name: "小李", pid:"04", job: "后端工程师"}]

解题方法:

• 先获得小刘的领导的id,即pid
• 然后找出和小刘同一个领导的同事,即pid相同(使用数组的filter方法)

        function f(data, name) {
            // 完成代码
            // 找到小刘上司
            const spid = data.filter((item) => {
                return item.name === name
            })[0].pid
            return data.filter((item) => {
                return item.pid === spid
            })
        }
        const arr1 = f(data, '小刘')
        console.log(arr1) // 

问题2: 找出 小亮 的所有下属

要求得到的返回结果为:

[{id:"07", name: "小丽", pid:"02", job: "产品经理"},

{id:"08", name: "大光", pid:"02", job: "产品经理"}]

解题方法:

• (1)获取小亮的id
• (2)找到pid和小亮的id相同的员工(使用数组的filter方法实现)

        function f2(data, name) {
            // 完成代码
            const sid = data.filter(item => {
                return item.name === name
            })[0].id
            return data.filter(item => {
                return item.pid === sid
            })

        }
        const arr2 = f2(data, '小亮')
        console.log(arr2) //

题目四

已有一个对象: var obj = { label: '男', value: 1, age: 18 }

需要返回结果为:

arr = ['男', '1', '18']

解题思路

• (1)先把对对象中的属性值取出来放入单独数组,可以使用for in 循环,使用Obeject.values()最方便
• (2)如果属性值是数值要转化为字符串

    <script>
        var obj = { label: '男', value: 1, age: 18 }

        function f(obj) {
            // 写代码，得到
            return Object.values(obj).map(item => item.toString())
        }
        var arr = f(obj);
        console.log(arr)
 // arr = ['男', '1', '18'] // 所有的属性值取出来，保存在数组中
    </script>

5.总结

箭头函数简写

• 许多方法中都有函数作为参数
• 可以使用箭头函数简写函数()=>{}
• 如果只有一个形参小括号可以不写
• 如果写在一行大括号可以省略,并且return可以省略
• 例如 arr.map(item => item.toString())