ES6语法_var、let 、 const、解析表达式、模板字符串、箭头函数、map 、reduce、Object优化(三)

本文涉及的产品
公共DNS(含HTTPDNS解析),每月1000万次HTTP解析
全局流量管理 GTM,标准版 1个月
云解析 DNS,旗舰版 1个月
简介: ⑤. map和reduce⑥. 对象(Object)优化

⑤. map和reduce


①. map接收一个函数,将原数组中的所有元素用这个函数处理后放入新数组返回


②. reduce接收两个参数:


带两个参数的一个函数(必须):从头开始每次用两个数组元素执行 第一个元素和第二个元素先执行执行完后返回一个结果又和第三个数组元素执行以此类推


起始参数(非必须):即有该参数的话 将用该参数和数组第一个元素执行 返回结果再和第二个元素执行 以此类推


    <script>
        //map接收一个函数,将原数组中的所有元素用这个函数处理后放入新数组返回
        //举例:有一个字符串数组,希望转为int数组
        let arr = ['1','20','-5','3'];
        console.log("处理前数组的是:"+typeof arr[0]);//处理前数组的是:string
        /*使用map对数组进行处理*/
        arr=arr.map(s=>parseInt(s));
        console.log("处理后数组是:"+typeof arr[0]);//处理后数组是:number
    </script>


②. reduce()为数组中每一元素依次执行回调函数,不包括数组中被删除或从未被赋值的元素


       //reduce
        let arr2=[1,3,5,7]
        //1.没有初始值的情况下
        /*
        a:上一次调用函数的值或者初始值,如果没有指定初始值,默认从数组第一个元素开始
        b:数组中当前被处理的元素
        */
        let sum=arr2.reduce((a,b)=>{
            console.log("上一次处理后:"+a);
            console.log("当前正在处理:"+b);
            return a+b
        })
        /*
        上一次处理后:1 
        当前正在处理:3 
        上一次处理后:4 
        当前正在处理:5 
        上一次处理后:9 
        当前正在处理:7 
        当前计算结果是:16
        */
        console.log(`当前计算结果是:${sum}`)
        //2. 指定初始值
        /*
        上一次处理后:100 
        当前正在处理:1 
        上一次处理后:101 
        当前正在处理:3 
        上一次处理后:104 
        当前正在处理:5 
        上一次处理后:109 
        当前正在处理:7
        */
        let sum2=arr2.reduce((a,b)=>{
            console.log("上一次处理后:"+a);
            console.log("当前正在处理:"+b);
            return a+b
        },100)


⑥. 对象(Object)优化


①. Object.keys(obj):获取对象的所有key形成的数组


②. Object.values(obj):获取对象的所有value形成的数组


③. Object.entries(obj):获取对象的所有key和value形成的二维数组。格式:[[k1,v1],[k2,v2],…]


④. Object.assign 方法的第一个参数是目标对象,后面的参数都是源对象


    <script>
     let obj={name:"tangzhi",age:24};
     //1.获取对象的所有key形成的数组
     console.log(Object.keys(obj));//Array [ "name", "age" ]
     //2.获取对象的所有value形成的数组
     console.log(Object.values(obj));//Array [ "tangzhi", 24 ]
     //3.获取对象的所有key和value形成的二维数组。格式:[[k1,v1],[k2,v2],…]
     console.log(Object.entries(obj));//Array [ [ "name", "tangzhi" ],[ "age", 24 ] ]
     let a = { name: "TANGZHI" };
     let b = { age: 25 };
     let c = { gender: "男" };
     //Object { name: "TANGZHI", age: 25, gender: "男" }
     console.log(Object.assign(a, b, c));
    </script>
相关文章
|
1月前
|
缓存 Java 程序员
Map - LinkedHashSet&Map源码解析
Map - LinkedHashSet&Map源码解析
67 0
|
1月前
|
算法 Java 容器
Map - HashSet & HashMap 源码解析
Map - HashSet & HashMap 源码解析
54 0
|
26天前
|
存储 Java API
详细解析HashMap、TreeMap、LinkedHashMap等实现类,帮助您更好地理解和应用Java Map。
【10月更文挑战第19天】深入剖析Java Map:不仅是高效存储键值对的数据结构,更是展现设计艺术的典范。本文从基本概念、设计艺术和使用技巧三个方面,详细解析HashMap、TreeMap、LinkedHashMap等实现类,帮助您更好地理解和应用Java Map。
45 3
|
2月前
ES6中map对象的使用,确实比Object好使哈
ES6中Map对象的使用优势,包括任意类型作为键、直接获取大小、增删查改操作等。Map的键可以是函数、对象、NaN等,支持forEach循环和for...of循环。
32 1
ES6中map对象的使用,确实比Object好使哈
|
1月前
|
算法 Java 程序员
Map - TreeSet & TreeMap 源码解析
Map - TreeSet & TreeMap 源码解析
34 0
|
1月前
|
编译器 C++
【C++】模板进阶:深入解析模板特化
【C++】模板进阶:深入解析模板特化
|
2月前
|
C# Android开发 开发者
Uno Platform 高级定制秘籍:深度解析与实践样式和模板应用,助你打造统一且高效的跨平台UI设计
【9月更文挑战第7天】Uno Platform 是一个强大的框架,支持使用 C# 和 XAML 创建跨平台 UI 应用,覆盖 Windows、iOS、Android、macOS 和 WebAssembly。本文介绍 Uno Platform 中样式和模板的应用,助力开发者提升界面一致性与开发效率。样式定义控件外观,如颜色和字体;模板则详细定制控件布局。通过 XAML 定义样式和模板,并可在资源字典中全局应用或嵌套扩展。合理利用样式和模板能简化代码、保持设计一致性和提高维护性,帮助开发者构建美观高效的跨平台应用。
58 1
|
5月前
|
JavaScript 前端开发 开发者
JavaScript中的const关键字解析
JavaScript中的const关键字解析
|
4月前
|
中间件 数据库 开发者
解析Python Web框架的四大支柱:模板、ORM、中间件与路由
【7月更文挑战第20天】Python Web框架如Django、Flask、FastAPI的核心包括模板(如Django的DTL和Flask的Jinja2)、ORM(Django的内置ORM与Flask的SQLAlchemy)、中间件(Django的全局中间件与Flask的装饰器实现)和路由(Django的urls.py配置与Flask的@app.route()装饰器)。这些组件提升了代码组织和数据库操作的便捷性,确保了Web应用的稳定性和可扩展性。
65 0
|
5月前
|
SQL 自然语言处理 前端开发
【JavaScript】ECMAS6(ES6)新特性概览(一):变量声明let与const、箭头函数、模板字面量全面解析
【JavaScript】ECMAS6(ES6)新特性概览(一):变量声明let与const、箭头函数、模板字面量全面解析
46 2

推荐镜像

更多