ES6-ES13学习笔记(5.0)

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>

 

 

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Python安装

一、Windows安装 打开官网&#xff1a;https://www.python.org/getit/ 下载exe安装包&#xff0c;双击安装默认选择路径 2、验证安装成功 cmd: python 能看到版本 cmd&#xff1a;pip 测试包管理工具 cmd&#xff1a;python -m pip install --user --upgrade pip -i https:…

高考开始了,计算机专业未来还会火吗?

2023年高考&#xff0c;今天开始第一场考试。而走出考场&#xff0c;考生们也将面临选报专业的难题。高考人数逐年攀升&#xff0c;录取率却不断下降。 过去10年&#xff0c;计算机专业可谓红透半边天&#xff0c;早早进入这个行业的&#xff0c;基本都吃到了很高的红利。然而…

java多线程面试题

一、创建线程有哪几种方式? 创建线程有三种方式&#xff0c;分别是继承Thread类、实现Runnable接口、实现Callable接口。 Runnable接口与Callable接口的方式基本相同&#xff0c;只是Callable接口里定义的方法有返回值&#xff0c;可以声明抛出异常。 二、run()和start()有什…

006-从零搭建微服务-注册中心(二)

写在最前 如果这个项目让你有所收获&#xff0c;记得 Star 关注哦&#xff0c;这对我是非常不错的鼓励与支持。 源码地址&#xff1a;https://gitee.com/csps/mingyue 文档地址&#xff1a;https://gitee.com/csps/mingyue/wikis 核心依赖 需要注册配置中心的服务引入下面 …

vuex核心

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 前言一、什么是状态管理&#xff1f;二、复杂的状态管理1.随着代码越来越多&#xff0c;需要管理的状态越来越复杂&#xff0c;当多个组件共享状态时&#xff0c;单…

chatgpt赋能python:Python如何运行两次

Python如何运行两次 Python是一种高级编程语言&#xff0c;非常受欢迎&#xff0c;因为它易于学习&#xff0c;简单易用&#xff0c;开放性强&#xff0c;而且功能强大。Python常用于处理各种任务&#xff0c;包括数据分析、Web应用开发、人工智能、自动化测试等。此外&#x…

Linux ls -l输出文件信息详解

在linux中&#xff0c;我们知道一切皆为文件&#xff0c;经常我们会使用ls -l去查看文件的信息&#xff0c;今天会大家详细讲解一下ls -l输出的文件属性信息。 1.ls -l输出 命令&#xff1a; ls -l 通过ls -l命令输出&#xff0c;我们可以看到上图中的属性信息输出&#xff…

PMP证书含金量也太高了吧!在一线城市可享受多项福利~

近年来&#xff0c;企业与企业、城市与城市间的人才争夺变得更加激烈&#xff0c;各大城市为了泛集聚和培养重点领域紧缺专业人才均针对持有国际职业资格认证的人才出台了相关优惠政策&#xff0c;目前我了解到的已有以下5个城市针对PMP项目管理及相关行业和认证出台了鼓励政策…

项目管理系统的设计与实现(ASP.NET,SQL)

开发环境&#xff1a;Microsoft Visual Studio 数据库&#xff1a;Microsoft SQL Server 程序语言&#xff1a;asp.NET(C#)语言本系统的开发使各大公司所的项目管理更加方便快捷&#xff0c;同时也促使项目的管理变的更加系统化、有序化。系统界面较友好&#xff0c;易于操作。…

MySQL CAST 函数与 CONVERT 函数

文章目录 CAST 函数与 CONVERT 函数1. 数字和小数点组成的字符串转换为整型2. 非数值字符串转换为整型3. 把整型转换为二进制4. 数字和小数点组成的字符串转换为浮点型 CAST 函数与 CONVERT 函数 前面我们介绍的两个函数用于字符串和日期类型之间进行相互转换&#xff0c;有时我…

什么?要求设计一个循环队列?

&#x1f388;个人主页:&#x1f388; :✨✨✨初阶牛✨✨✨ &#x1f43b;推荐专栏: &#x1f354;&#x1f35f;&#x1f32f;C语言初阶 &#x1f354;&#x1f35f;&#x1f32f;C语言进阶 &#x1f511;个人信条: &#x1f335;知行合一 &#x1f349;本篇简介:>:讲解用c…

直播问答功能(互动功能接收端JS-SDK)

功能概述 本模块主要用于展示问答模块。 初始化及销毁 在实例化该模块并进行使用之前&#xff0c;需要对SDK进行初始化配置&#xff0c;详细见参考文档。 在线文件引入方式 // script 标签引入&#xff0c;根据版本号引入JS版本。 <script src"https://websdk.vi…

10课程设计收尾及优秀作品展示答辩【FPGA模型机课程设计】

10课程设计收尾及优秀作品展示答辩【FPGA模型机课程设计】 前言说明推荐10课程设计收尾及优秀作品展示答辩安排 目录一、单周期CPU的设计过程1、基本的20条指令固定指令格式设计I 型指令设计J型指令设计lw sw指令设计 2、扩展的20条指令J型扩展指令设计乘法除法指令格式 3、实现…

什么是lamp架构

LAMP架构介绍 LAMP动态网站架构 LAMP是指一组通常一起使用来运行动态网站或者服务器的自由软件名称首字母缩写。 1、LAMP分别代表什么&#xff1f; L代表服务器操作系统使用LinuxA代表网站服务使用的是Apache软件基金会中的httpd软件M代表网站后台使用的数据库是MySQL数据库…

springboot 2.6.12 自定义解析 yaml 加密数据

文章目录 一、简介二、yaml 默认解析简单说明三、自定义 yaml 解密解析器四、配置 PropertySourceLoader五、简单测试 一、简介 为了保证项目的配置文件的安全性&#xff0c;需要对第三方组件 mysql、redis、es、mq 等用户名密码进行加密处理&#xff0c;可以使用现成的三方包…

项目经验分享:LVGL编程举例

本文介绍如何在成功移植LVGL的基础之上&#xff0c;编写自己的LVGL GUI程序。 文章目录 1. LVGL组件简介与LVGL仿真1.1 LVGL组件1.2 LVGL仿真 2. 代码结构3. 编程目标4. 编程前的准备5. LVGL编程基础5.1 简单示例代码5.2 设置组件位置5.3 图片的显示5.4 组件的事件响应5.5 设置…

【论文阅读】Twin Neural Network Regression

论文下载 GitHub bib: ARTICLE{SebastianKevin2022Twin,title {Twin neural network regression},author {Sebastian Johann Wetzel and Kevin Ryczko and Roger Gordon Melko and Isaac Tamblyn},journal {Applied AI Letters},year {2022},volume {3},number …

【LeetCode】260. 只出现一次的数字 III

260. 只出现一次的数字 III&#xff08;中等&#xff09; 思路 这道题是136. 只出现一次的数字 的进阶版&#xff0c;需要找出两个仅出现一次的元素。有了上一题的基础&#xff0c;我们很容易就想到要用异或来解决&#xff0c;但是由于这题最终会剩下两个不同的元素&#xff0…

5.31串讲Spring、Vue相关问题

5.31串讲 SSM相关问题 文章目录 5.31串讲 SSM相关问题Spring Security&#xff08;Shiro&#xff09;Security框架认证流程Security流程图展示 Vue相关指令四个阶段 axios Spring Security&#xff08;Shiro&#xff09; Spring Security是一个基于Spring 的安全框架&#xff…

软考A计划-电子商务设计师-电子商务系统规划

点击跳转专栏>Unity3D特效百例点击跳转专栏>案例项目实战源码点击跳转专栏>游戏脚本-辅助自动化点击跳转专栏>Android控件全解手册点击跳转专栏>Scratch编程案例 &#x1f449;关于作者 专注于Android/Unity和各种游戏开发技巧&#xff0c;以及各种资源分享&am…