ES6-ES13学习笔记(5.0)

news2024/12/24 3:05:38

ES2022的函数

//findLast findLastIndex()  ES2022

发现在电脑自带的联想浏览器不支持此函数,还报错了

对于ECMA的支持还和浏览器有关以及浏览器版本有关,然后我使用Google浏览器就可以正常使用,

 

 1.扩展运算符:三个点...    

 ...复制为浅复制,如果数组中拥有嵌套就不行了

2.array.from 转换为数组

3.Array.of 

注意与Array()的区别,如果直接使用Array(5),只是声明只有5个内容的空数组,而Array.of (5)则是声明数组元素为5的数组,即[5]。

4.find findIndex()  正序查找

//findLast findLastIndex()  ES2022  逆序查找

5.//flat() flatMap()

扁平化处理,将高维数组转换成一维数组

flatMap()适合复杂对象的展开

<!--
 * @Author: RealRoad1083425287@qq.com
 * @Date: 2023-06-01 09:41:03
 * @LastEditors: Mei
 * @LastEditTime: 2023-06-01 10:34:43
 * @FilePath: \vscode\ECMA\06\01.html
 * @Description: 
 * 
 * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved. 
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
    </ul>
    <script>
        //1.扩展运算符  ...复制为浅复制,如果数组中拥有嵌套就不行了
        let arr1=[1,2,3]
        let arr2=['a','b','c']
        let arr3=arr1.concat()
        arr3.pop()
        let arr4=[...arr2]
        console.log(arr1)
        console.log(arr2)
        console.log(arr3)
        console.log(arr4)

        let arr5=[4,5,6]
        console.log([...arr1,...arr5])
        let myarr=[1,2,3,4,5,6,7,8]
        let [a,b,...c]=myarr
        console.log(a,b,c)

        //2. Array.from
        //arguments

        function test(){
            console.log(Array.from(arguments))
            console.log(arguments)
        }
        test(1,2,3,4)

        let olis=document.querySelectorAll("li")
        console.log(olis)
        Array.from(olis).map(function(){})

        //3.  Array.of
        let arr=[1,2,3]
        let arr6=Array(1,2,3)
        let arr7=Array.of(1,2,3)
        let arr8=Array(5)
        let arr9=Array.of(5)
        console.log(arr6,arr7)
        console.log(arr8)
        console.log(arr9)

        //4. find findIndex()

        let arr10=[11,12,13,14,15]

        let res=arr10.find(function(item){
            return item>13
        })
        let res2=arr10.findIndex(function(item){
            return item>13
        })
        console.log(res)
        console.log(res2)

        //findLast findLastIndex()  ES2022
        // let res3=arr10.findLast(function(item){
        //     return item>13
        // })
        // console.log(res3)

        let arr11=new Array(3).fill('mez')
        console.log(arr11)
        let arr12=[11,22,33]
        console.log(arr12.fill("mez",1,2))


        //flat() flatMap()

        let arr13=[1,2,3,[4,5,6]]
        let arr14=arr13.flat()
        console.log(arr13,arr14)
        
        let arr15=[
            {
                name:"A",
                list:["安阳,鞍山"]
            },
            {
                name:"B",
                list:["北京","保定"]
            }
            
        ]
        console.log(arr15.flat())
        let res4=arr15.flatMap(function(item){
            return item.list
        })
        console.log(res4)
    </script>
</body>
</html>

 

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/597041.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

第一行代码 第十三章 高级技巧

第13章 高级技巧 全局获取Context的技巧 回想这么久以来我们所学的内容&#xff0c;你会发现有很多地方都需要用到Context&#xff0c;弹出Toast的时候需要&#xff0c;启动活动的时候需要&#xff0c;发送广播的时候需要&#xff0c;操作数据库的时候需要&#xff0c;使用通…

图解LeetCode链表题(中等)剖析

文章目录 &#x1f490;文章导读&#x1f490;1.合并零之间的结点解题思路 &#x1f490;2.链表中最大孪生和解题思路 &#x1f490;3.链表的随机节点解题思路 &#x1f490;4.复杂链表的复制解题思路 &#x1f490;5.两辆交换两表中的节点解题思路 &#x1f490;文章导读 &…

关于python pycharm中输出的内容不全的解决办法

控制台输出&#xff1a; 解决方案&#xff1a; pandas 库 # 显示所有列 pd.set_option(display.max_columns, None) # 显示所有行 pd.set_option(display.max_rows, None) # 设置value的显示长度 pd.set_option(max_colwidth, 100) # 设置1000列时才换行 pd.set_option…

DataFrame/字典/列表之间的相互转换

DataFrame —> 字典 参考&#xff1a;pandas关于to_dict的使用_pandas to_dict_曼珠沙华Devil的博客-CSDN博客 pandas提供了 DataFrame.to_dict() 函数&#xff0c;将DataFrame类型转化为字典类型 DataFrame.to_dict(orientdict) # orient 可省略 对于写入的orient不同…

闭包基本知识汇总

闭包基本知识汇总 一、什么是闭包&#xff1f; 闭包是指有权限访问另一个函数作用域中的变量的函数&#xff0c;在Javascript中&#xff0c;只有函数内部的子函数才能读取局部变量&#xff0c;因此可以把闭包简单理解成 “定义在一个函数内部的函数” 。所以&#xff0c;在本…

AI当道,元宇宙赛道是风口还是噱头?

一个新概念的诞生往往要经过无数次的锤炼&#xff0c;宛如一场漫长、深刻的头脑风暴。而发展到今天&#xff0c;处在风口之上&#xff0c;各行各业都急切往元宇宙概念靠拢&#xff0c;元宇宙已经与资本市场共舞。 伴随着全球多家行业巨头的布局以及元宇宙在游戏领域的率先落地…

c#快速入门(上)

欢迎来到Cefler的博客&#x1f601; &#x1f54c;博客主页&#xff1a;那个传说中的man的主页 &#x1f3e0;个人专栏&#xff1a;题目解析 &#x1f30e;推荐文章&#xff1a;题目大解析2 目录 &#x1f449;&#x1f3fb; c#和c不同之处&#x1f449;&#x1f3fb;程序文件的…

华为OD机试真题 Java 实现【简单的解压缩算法】【2023Q1 200分】,附详细解题思路

一、题目描述 现需要实现一种算法&#xff0c;能将一组压缩字符串还原成原始字符串&#xff0c;还原规则如下&#xff1a; 1、字符后面加数字N&#xff0c;表示重复字符N次。例如&#xff1a;压缩内容为A3&#xff0c;表示原始字符串为AAA。 2、花括号中的字符串加数字N&…

tcpdump 抓包工具详细图文教程(上)

目录 一、tcpdump 抓包工具的基本介绍和学习基础 1.1 常用的抓包工具 1.2 tcpdump 抓包工具介绍 二、tcpdump 抓包工具使用环境和初体验 2.1 编译安装 tcpdump 2.2 抓包 三、讲解 TCP 协议报文报头 四、tcpdump 抓包工具常规过滤规则 4.1 tcpdump 的 host 和 net 过…

Flutter 又一元老离职,感谢 Tim 这些年的付出

前天在 insiders 收到 Tim Sneath 的离职邮件时感觉很震惊&#xff0c;因为他绝对是 Flutter 团队的元老级人物&#xff0c;几乎每次一次 Flutter 版本发布和社区活动都有他的身影&#xff0c;可以说他是我的 Flutter 领路人之一。 Tim 是在 2017 加入 Flutter 团队&#xff0…

SpringCloud微服务踩坑系列:UnknownContentTypeException

错误信息如下&#xff1a; org.springframework.web.client.UnknownContentTypeException: Could not extract response: no suitable HttpMessageConverter found for response type [class com.cyf.internalCommon.dto.ResponseResult] and content type [text/plain;charset…

使用WordPress提高企业敏捷性

喜欢WordPress的原因有很多&#xff1a;该平台非常适合内容管理以及控制预算。此外&#xff0c; 在 提高开发效率和简化项目管理方面&#xff0c;WordPress可以通过多种方式提供帮助。 对于任何企业业务&#xff0c;目标始终是在不影响质量的情况下更快地启动项目、发布修复和…

day3 -- select语句学习

文章目录 数据库和表的准备selectselect order byselect whereselect 高级过滤操作使用通配符进行过滤使用正则表达式进行搜索 数据库和表的准备 下载《mysql必知必会》提供的脚本用于创建样例表 cd /mnt/d/unix_dir wget https://forta.com/wp-content/uploads/books/067…

【Linux从入门到精通】进程的状态

当我们了解到进程是什么东西后&#xff0c;我们再来看看进程都会有那些状态。本篇文章会对进程的不同状态进行详解&#xff0c;希望会对你的理解有所帮助&#xff01; 文章目录 一、了解进程的不同状态 二、详解进程的不同状态 2、1 R运行状态&#xff08;running&#xff09; …

开源赋能 普惠未来|中软国际寄语 2023 开放原子全球开源峰会

中软国际作为行业领先的全球化软件与信息技术服务企业及数字化转型服务商&#xff0c;近年来积极布局开源生态&#xff08;OpenHarmony、openEuler&#xff09;、智能云、ERP、AIGC、教育科技、智能车六大赛道&#xff0c;加速业务转型创新。 中软国际为开放原子开源基金会白金…

文字环绕图片效果实现

书接上回&#xff0c;我们来讲讲如何实现“文字环绕图片”的效果吧。整体预计实现的效果如下&#xff1a; 日常杂谈 我喜欢看动漫&#xff0c;接下来的所有博客都会和我日常生活结合在一起写&#xff0c;这样感觉会让自己的博客会有温度&#xff0c;我感觉每个人都应该有自己的…

最新喜讯|易知微入选2023数字孪生解决方案提供商TOP50

近日&#xff0c;互联网周刊发布《2023数字孪生解决方案提供商TOP50》&#xff0c;杭州易知微科技有限公司在榜。 中国科学院主管的《互联网周刊》&#xff0c;创刊于1998年&#xff0c;是中国最具公信力的杂志之一&#xff0c;其颁布的榜单极具权威性与专业度&#xff0c;对产…

基于非局部图注意力网络的鲁棒三维形状分类

文章目录 Robust 3D Shape Classification via Non-local Graph Attention Network摘要本文方法Global Structure Network (GSN)Global Relationship Network (GRN)Local Feature Learning based on MLP-STNetwork Channel Fusion ModuleGlobal descriptor 实验结果 Robust 3D …

分布式锁的应用场景与分布式锁实现(四):基于MySQL实现分布式锁与分布式锁总结

分布式锁的应用场景与分布式锁实现&#xff08;三&#xff09;&#xff1a;基于Zookeeper实现分布式锁 基于MySQL实现分布式锁 ​ 不管是JVM锁还是MySQL锁&#xff0c;为了保证线程的并发安全&#xff0c;都提供了悲观独占排他锁。所以独占排他也是分布式锁的基本要求。 ​ …

在can协议的基础下编写DBC文件,然后使用该DBC文件下发can协议到底盘完整流程

目录 前言一、VectorCANdb下载及安装二、DBC文件的编写1.新建dbc文件2.建立dbc2.1根据CAN协议设置以下的signals2.2设置报文2.3建立报文与信号的关系2.4建立节点 三、编写程序使用UDP通信下发can协议1.查看can口、电脑ip以及端口号2.编写测试程序 前言 最近完成了一个项目&…