【前端】必学知识ES6 1小时学会

1.ES6概述

2.let和const的认识

3.let、const、var的区别

4.模板字符串

5.函数默认参数

6.箭头函数【重点】

​编辑7.对象初始化简写以及案例分析 【重点】

8.对象解构

8.对象传播操作符

9.对象传播操作符案例分析

​编辑 10.数组Map

11.数组Reduce 

12.NodeJS小结

1.ES6概述

ES6, 全称 ECMAScript 6.0 ,是 JavaScript 的下一个版本标准,2015.06 发版。

2.let和const的认识

以前都是用var定义常量和变量 

现在使用let定义变量 const定义常量更好的区分

3.let、const、var的区别

这里应该打印0 1 2 3 4 5但是直接打印5了 这是var的一个问题 变量穿透 因为var定义可以是变量也

可以是常量 所以它作为常量来说 这里就穿透了

使用let 定义变量 就不会造成穿透问题

同时我们的常量都是不可以修改的 const可以直接定义常量 不允许修改 

修改常量直接报错

// 在实际开发和生产中,如果是小程序,uniapp或者脚手架中,可以大胆使用let和const

// 在web开发中,建议还是var,有些浏览器不支持ES6

小结:

        1.let和const主要解决 变量穿透 和 常量修改问题

 

4.模板字符串

相比较传统的字符串拼接 ES6的 `${}`更加简洁好用

5.函数默认参数

6.箭头函数【重点】

7.对象初始化简写以及案例分析 【重点】

对象简写案例

8.对象解构

8.对象传播操作符

    <script>// 对象传播操作符 ...var person={name:'taohy',address:'suzhou',link:'csdn',phone:15250,go(){console.log('开始上课了....')}}//解构出来var {name,address,...person2} = person;console.info(name);console.info(address);console.info(person2);</script>

9.对象传播操作符案例分析

<script>// java 后台 // 数据格式 var userPage ={page:10,users:[{},{}],pageNo:1,pageSize:10,total:100}// 异步请求// $.post('/user/search',function(res){})var userPage = {pages:10,users:[{},{}],pageNo:1,pageSize:100,total:100};var {users,...userPage2} = userPage;console.log(users);console.log(userPage2);
</script>

 10.数组Map

    <script>let arr = [1,2,3,4,5,6,7];// 需求,对数组中每个数 乘以2// 传统做法let arrNew = [];for(let i = 0; i < arr.length; i++){arrNew.push(arr[i] * 2);}console.info(arrNew);// ES6 Map 自带循环功能 并且会把处理的值回填到对应的位置// var arrNew2 = arr.map(function (ele) {//     return ele * 2; // 必须return// })// 省略var arrNew2 = arr.map(ele => ele * 2);console.info(arrNew2);// map 处理对象的数据 // 实现对象年龄加1var users = [{age:10,name:'小绿'},{age:12,name:'小红'}];//    var usersNew= users.map(function (ele) {//         ele.age = ele.age + 1;//         return ele;//     })// 简写var usersNew = users.map(ele => {ele.age = ele.age + 1;ele.check = true;return ele;});console.info(usersNew);</script>

 

11.数组Reduce 

    <script>let arr = [1,2,3,4];// a=1 b=2 a+b;a=3 b=3 a+b; let result = arr.reduce((a,b) => {return a + b;})console.info(result);// 全部相加 10</script>

12.NodeJS小结

ES6 js新建文件中,在node中可以直接使用

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

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

相关文章

代码随想录算法训练营第四十四天【动态规划part06】 | 完全背包、518. 零钱兑换 II、377. 组合总和 Ⅳ

完全背包 有N件物品和一个最多能背重量为W的背包。第i件物品的重量是weight[i]&#xff0c;得到的价值是value[i] 。每件物品都有无限个&#xff08;也就是可以放入背包多次&#xff09;&#xff0c;求解将哪些物品装入背包里物品价值总和最大。 题目链接&#xff1a; 题目页…

计算机毕业设计 基于Hadoop的物品租赁系统的设计与实现 Java实战项目 附源码+文档+视频讲解

博主介绍&#xff1a;✌从事软件开发10年之余&#xff0c;专注于Java技术领域、Python人工智能及数据挖掘、小程序项目开发和Android项目开发等。CSDN、掘金、华为云、InfoQ、阿里云等平台优质作者✌ &#x1f345;文末获取源码联系&#x1f345; &#x1f447;&#x1f3fb; 精…

YOLO目标检测——泄露检测数据集下载分享【含对应voc、coco和yolo三种格式标签】

实际项目应用&#xff1a;泄露检测数据集说明&#xff1a;泄露检测数据集&#xff0c;真实场景的高质量图片数据&#xff0c;数据场景丰富&#xff0c;含多个类别标签说明&#xff1a;使用lableimg标注软件标注&#xff0c;标注框质量高&#xff0c;含voc(xml)、coco(json)和yo…

AES 加解密

AES 加解密 AES(Advanced Encryption Standard),又称高级加密标准,是一种对称加密算法,也是目前广泛使用的加密技术之一。其主要特点是加密速度快、安全性高、可扩展性好等。 AES 算法采用对称加密的方式,即加密和解密使用相同的密钥进行操作。密钥长度可以是 128、192…

【JavaSE】不允许你不会使用String类

&#x1f3a5; 个人主页&#xff1a;深鱼~&#x1f525;收录专栏&#xff1a;JavaSE&#x1f304;欢迎 &#x1f44d;点赞✍评论⭐收藏 目录 前言&#xff1a; 一、常用方法 1.1 字符串构造 1.2 String对象的比较 &#xff08;1&#xff09;比较是否引用同一个对象 注意…

从零开始的C++(十九)

红黑树&#xff1a; 一种接近平衡的二叉树&#xff0c;平衡程度低于搜索二叉树。 特点&#xff1a; 1.根节点为黑 2.黑色结点的子结点可以是红色结点或黑色结点。 3.红色结点的子结点只能是黑色结点。 4.每个结点到其所有叶子结点的路径的黑色结点个数相同。 5.指向空的…

OmniGraffle

安装 在mac上安装OmniGraffle&#xff0c;找一个正版或者啥的都行&#xff0c;安装好后&#xff0c;可以直接在网上找一个激活码&#xff0c;然后找到软件的许可证&#xff0c;进行添加即可。 使用 新建空白页 然后图形啥的看一眼工具栏就知道了&#xff0c;颜色形状还是挺…

音视频项目—基于FFmpeg和SDL的音视频播放器解析(二十一)

介绍 在本系列&#xff0c;我打算花大篇幅讲解我的 gitee 项目音视频播放器&#xff0c;在这个项目&#xff0c;您可以学到音视频解封装&#xff0c;解码&#xff0c;SDL渲染相关的知识。您对源代码感兴趣的话&#xff0c;请查看基于FFmpeg和SDL的音视频播放器 如果您不理解本…

【C++】拷贝构造函数,析构函数详解!

&#x1f490; &#x1f338; &#x1f337; &#x1f340; &#x1f339; &#x1f33b; &#x1f33a; &#x1f341; &#x1f343; &#x1f342; &#x1f33f; &#x1f344;&#x1f35d; &#x1f35b; &#x1f364; &#x1f4c3;个人主页 &#xff1a;阿然成长日记 …

【LeetCode】挑战100天 Day13(热题+面试经典150题)

【LeetCode】挑战100天 Day13&#xff08;热题面试经典150题&#xff09; 一、LeetCode介绍二、LeetCode 热题 HOT 100-152.1 题目2.2 题解 三、面试经典 150 题-153.1 题目3.2 题解 一、LeetCode介绍 LeetCode是一个在线编程网站&#xff0c;提供各种算法和数据结构的题目&…

Vue3 实现elementPlus的table列宽调整和拖拽

1、需要的包 // 除了Vue和element-plus外还需要以下的包 npm install sortablejs2、具体代码如下&#xff0c;可直接粘贴运行 <template><div class"draggable-table"><el-table ref"tableRef":data"tableData.data":key"…

Java-飞翔的小鸟

前言 基于Java的飞翔小鸟游戏&#xff0c;本代码来自b站up主分享。本游戏所需的图片素材需要自己获取并下载&#xff0c;在此视频下&#xff0c;视频链接&#xff1a;【Java经典小游戏项目之飞翔的小鸟】 https://www.bilibili.com/video/BV1ou411o7br/?p10&share_source…

C#编程题分享(4)

换行输出整数问题 输⼊任意⼀个位数未知的整数&#xff0c;输出这个数每⼀位上的数字。输出的时候&#xff0c;从个位开始输出&#xff0c;每输出⼀个数字换⼀⾏。样例输⼊&#xff1a;3547 输出&#xff1a;7 换行输出 4 换行输出5 换行输出3 int n Convert.ToInt32(Conso…

【python基础(九)】文件和异常详解:使用、读取、写入、追加、保存用户的信息,以及优雅的处理异常

文章目录 一. 从文件中读取数据1. 读取整个文件2. 文件路径3. 逐行读取4. 创建一个包含文件各行内容的列表 二. 写入文件1. 写入空文件2. 写入多行3. 附加到文件 三. 异常1. 处理ZeroDivisionError异常2. 使用try-except代码块3. try-except-else ing4. 处理FileNotFoundError异…

如何在AD上创建完整的项目

首先&#xff0c;我们先安装好AD&#xff0c;这里我使用的是AD22&#xff0c;安装过程如下&#xff1a; Altium Designer 22下载安装教程-CSDN博客 Altium Designer 22是全球领先的PCB设计软件之一&#xff0c;为电路板设计师提供了一种集成的解决方案&#xff0c;旨在简化和加…

探讨工业元宇宙和数字孪生的关系

就在各类技术专家还在试图设想元宇宙虚拟世界将为企业和消费者带来什么时&#xff0c;工业元宇宙虚拟世界已经在改变人们设计、制造以及与各行业物理实体互动的方式。尽管元宇宙的定义比比皆是&#xff0c;工业元宇宙将如何发展还有待观察&#xff0c;但数字孪生越来越多地被视…

shell(函数和数组)

目录 一、函数 1.函数的由来 2.函数的作用 3.函数的使用方法 4.函数的定义 5.查看函数 6.删除函数 7.函数返回值 8.函数的传参数 9.函数递归 二、数组 1.数组的相关介绍 2.声明数组 3.定义数组的格式 4.冒泡排序 总结&#xff1a;本章主要介绍了函数和数组相关知…

运维 在Windows上搭建小型Git服务

文章目录 1、Git选型1.1、主要特性1.2、代码管理1.3、工单管理1.4、Pull/Merge requests1.5、第三方集成1.6、选型结论 2、环境搭建2.1、Gitea下载2.2、Gitea安装2.3、配置服务信息2.4、运行服务2.5、注册Gitea为服务2.6、正常使用 1、Git选型 1.1、主要特性 1.2、代码管理 1.…

多数据库使用django-apscheduler时,migrate后并不能生成django_apscheduler_djangojob表的问题

先说一下django-apscheduler定时器的使用过程&#xff1a; django-apscheduler基本使用 1.安装django-apscheduler代码如下&#xff08;示例&#xff09;&#xff1a; pip install django-apscheduler 2.配置settings.py的INSTALLED_APPS代码如下&#xff08;示例&#xff09…

项目中常用的 19 条 SQL 优化宝典

一、EXPLAIN 做MySQL优化,我们要善用 EXPLAIN 查看SQL执行计划。 下面来个简单的示例,标注(1,2,3,4,5)我们要重点关注的数据 type列,连接类型。一个好的sql语句至少要达到range级别。杜绝出现all级别 key列,使用到的索引名。如果没有选择索引,值是NULL。可以采取强制索引…