当前位置: 首页 > news >正文

ES6-箭头函数、解构赋值、对象简写

箭头函数特点

1、 (只有1个形参) 可以省略()
2、 {} 可以省略 只有一句代码 或 只有返回值的时候,省略return
3、arguments 不可用,arguments在没有形参的时候可以拿到调用函数拿在的实参 获取伪数组通过Array.from转为真数组。
4、 箭头函数没有this,
箭头函数this时父级作用域

var test1 = function(){console.log("111")}test1()
写法var test2 = () =>console.log("2222")test2()

返回一句对象时,需要在外面包一个(),避免{}混淆

 var test = ()=> ({name:"xiaoming"})console.log(test())

解构赋值

快速的从对象和数组中获取里面的成员

var arr = ["xiaoming","tiechui","dddddd"]let[x,y,z] =arrconsole.log(x,y,z)//打印为	xiaoming tiechui dddddd
var a=10var b=5var[b,a]=[a,b]console.log(a,b);打印a=5,b=10

多维度数组与对象 数组嵌套

多维度数组

var arr2 = [1,2,[3,4,[5]]]//多维度数组 数组嵌套console.log(arr2[2][2][0]); //ES5var[q,w,[e,r,[t]]] =arr2 //ES6console.log(t)//	打印为5

多维度对象

	ES5var obj={name:"tiechui",age:100,location:"xingtai"}let {name,age,location:mylocation} =objdocument.write(name)document.write(age)document.write(mylocation)ES6
var obj2 = {name:"kerwin",age:100,location:{province:"tingtai",city:"shahe"},hobby:[11,22,33]}var  {name,age,location:{province,city},hobby:[m,n,k]} =obj2console.log(name,age,province,city,m,n,k)//结果都为 tiechui100xingtai

ES6对象简写

在对象中key值与后面变量相等时就可以省略写法:

<input type="text" id="myunername">
<input type="password" id="mypasswoed">
<button id="mybtn">login</button>
<script>mybtn.onclick = function(){let unername = myunername.valuelet password = mypasswoed.valueconsole.log(unername,password)var obj= {unername, //unername:unername,password  //password:password}console.log("发给后端的结构",obj);}</script>

var obj={
a:11,
getName:function(){ //可以把:function删掉
console.log(this.a);
}
}
obj.getName()
打印为11

相关文章:

ES6-箭头函数、解构赋值、对象简写

箭头函数特点 1、 (只有1个形参) 可以省略() 2、 {} 可以省略 只有一句代码 或 只有返回值的时候,省略return 3、arguments 不可用&#xff0c;arguments在没有形参的时候可以拿到调用函数拿在的实参 获取伪数组通过Array.from转为真数组。 4、 箭头函数没有this&#xff0c; …...

【CSS】CSS 背景设置 ② ( 背景位置 | 背景位置-方位值设置 )

文章目录一、背景位置1、语法说明2、注意事项二、背景位置-方位值设置1、效果展示2、完整代码示例一、背景位置 1、语法说明 如果 盒子的大小 大于 背景图片的大小 , 默认的 图片 位置是 左上角 ; 设置背景位置的 CSS 语法如下 : background-position : length length backgro…...

HTML 扫盲

✏️作者&#xff1a;银河罐头 &#x1f4cb;系列专栏&#xff1a;JavaEE &#x1f332;“种一棵树最好的时间是十年前&#xff0c;其次是现在” 目录前言HTML 结构快速生成代码框架HTML 常见标签注释标签标题标签: h1-h6段落标签&#xff1a;p换行标签&#xff1a;br格式化标签…...

项目中用到的责任链模式

目录 1.什么是责任链&#xff1f;它的原理是什么&#xff1f; 2.应用场景 ​3.项目中的应用 传送门&#xff1a;策略模式&#xff0c;工作中你用上了吗&#xff1f; 1.什么是责任链&#xff1f;它的原理是什么&#xff1f; 将请求的发送和接收解耦&#xff0c;让多个接收对象…...

C++复习笔记--STL的string容器和vector容器

1--string容器string 本质上是一个类&#xff0c;其不同于指针 char*&#xff0c;string 类的内部封装了 char*&#xff0c;用于管理字符串&#xff0c;是一个 char* 型的容器&#xff1b;1-1--string构造函数string 的构造函数原型&#xff1a;string(); // 创建一个空的字符串…...

第一章 软件项目管理概述

项目(Project)是为了创造一个唯一的产品或提供一个唯一的服务而进行的临时性的努力。项目的特征PMBOK(A guide to the Project management Body Of Knowledge:项目管理知识体系指南)五大过程组和十大知识领域从时间角度出发&#xff0c;项目管理分为五大过程组&#xff1a;启动…...

【Linux系统编程】06:共享内存

共享内存 OVERVIEW共享内存一、文件上锁flock二、共享内存1.关联共享内存ftok2.获取共享内存shmget3.绑定共享内存shmat4.绑定分离shmdt5.控制共享内存shmctl三、亲缘进程间通信1.共享内存写入与读取2.共享内存解绑与删除3.共享内存综合四、非亲缘进程间通信1.通过sleep同步2.通…...

【专项】112. 路径总和

112. 路径总和 给你二叉树的根节点 root 和一个表示目标和的整数 targetSum 。判断该树中是否存在 根节点到叶子节点 的路径&#xff0c;这条路径上所有节点值相加等于目标和 targetSum 。如果存在&#xff0c;返回 true &#xff1b;否则&#xff0c;返回 false 。 叶子节点 …...

【数据结构】堆排序

堆是一种叫做完全二叉树的数据结构&#xff0c;可以分为大根堆&#xff0c;小根堆&#xff0c;而堆排序就是基于这种结构而产生的一种程序算法。大堆&#xff1a;每个节点的值都大于或者等于他的左右孩子节点的值小堆&#xff1a;每个结点的值都小于或等于其左孩子和右孩子结点…...

论文阅读笔记《GAMnet: Robust Feature Matching via Graph Adversarial-Matching Network》

核心思想 本文提出一种基于图对抗神经网络的图匹配算法&#xff08;GAMnet&#xff09;,使用图神经网络作为生成器分别生成源图和目标图的节点的特征&#xff0c;并用一个多层感知机作为辨别器来区分两个特征是否来自同一个图&#xff0c;通过对抗训练的办法提高生成器特征提取…...

数据安全—数据完整性校验

1、数据安全保障三要素即 保密性 完整性、可用性机密性&#xff1a;要求数据不被他人轻易获取&#xff0c;需要进行数据加密。完整性&#xff1a;要求数据不被他人随意修改&#xff0c;需要进行签名技术可用性&#xff1a;要求服务不被他人恶意攻击&#xff0c;需要进行数据校验…...

Java 最小路径和

最小路径和中等给定一个包含非负整数的 m x n 网格 grid &#xff0c;请找出一条从左上角到右下角的路径&#xff0c;使得路径上的数字总和为最小。说明&#xff1a;每次只能向下或者向右移动一步。示例 1&#xff1a;输入&#xff1a;grid [[1,3,1],[1,5,1],[4,2,1]]输出&…...

Flask+VUE前后端分离的登入注册系统实现

首先Pycharm创建一个Flask项目&#xff1a; Flask连接数据库需要下载的包&#xff1a; pip install -U flask-cors pip install flask-sqlalchemy Flask 连接和操作Mysql数据库 - 王滚滚啊 - 博客园 (cnblogs.com) sqlAlchemy基本使用 - 简书 (jianshu.com) FlaskVue前后端分…...

【Go】用Go在命令行输出好看的表格

用Go在命令行输出好看的表格前言正文生成Table表头设置插入行表格标题自动标号单元格合并列合并行合并样式设置居中设置数字自动高亮标红完整Demo代码结语前言 最近在写一些运维小工具&#xff0c;比如批量进行ping包的工具&#xff0c;实现不困难&#xff0c;反正就是ping&am…...

怎么处理消息重发的问题?

消息队列在消息传递的过程中&#xff0c;如果出现传递失败的情况&#xff0c;发送方会重试&#xff0c;在重试的过程中&#xff0c;可能会产生重复的消息。 消息重复的情况必然存在 关于传递消息时能够提供的服务质量标准&#xff0c;MQTT协议给出了三种不同的标准&#xff1…...

JVM 运行时数据区(数据区组成表述,程序计数器,java虚拟机栈,本地方法栈)

JVM 运行时数据区JVM 运行时数据区3.1运行时的数据区组成概述3.1.1程度计数器3.1.2java虚拟机栈3.1.3本地方法栈3.1.4java堆3.1.5方法区3.2程序计数器3.3java虚拟机栈3.4本地方法栈JVM 运行时数据区 堆,方法区(元空间) 主要用来存放数据 是线程共享的. 程序计数器,本地方法栈…...

Oracle ASM磁盘组配置、日常运维、故障处理等操作资料汇总

ASM&#xff08;自动存储管理&#xff09;在数据库中是非常重要的组成部分&#xff0c;它可以为磁盘提供统一的存储管理、提高磁盘访问的性能和可用性、简化管理复杂度&#xff0c;从而为数据库的运行提供更好的支持。这里就为大家整理了墨天轮数据社区上一些ASM相关基础知识、…...

java对象的创建与内存分配机制

文章目录对象的创建与内存分配机制对象的创建类加载检查分配内存初始化零值设置对象头指向init方法其他&#xff1a;指针压缩对象内存分配对象在栈上分配对象在Eden区中分配大对象直接分配到老年代长期存活的对象进入老年代对象动态年龄判断老年代空间分配担保机制对象的内存回…...

本地存储localStorage、sessionStorage

目录 一、localStorage 二、sessionStorage 三、本地存储处理复杂数据 一、localStorage 介绍 &#xff08;1&#xff09;数据存储在用户浏览器中 &#xff08;2&#xff09;设置、读取方便、甚至页面刷新不会丢失数据 &#xff08;3&#xff09;容量较大&#xff0c;se…...

JavaSE: 网络编程

1.1 概述java程序员面对统一的网络编程环境B/S 架构 和 C/S架构1.2 网络通信的两个要素通信双方的地址&#xff1a;ip 端口号网络通信协议&#xff1a;TCP/IP协议&#xff08;事实上的国际规则&#xff09;、OSI模型&#xff08;理想化&#xff09;1.3 Inet Address本地回环地…...

《从零掌握MIPI CSI-2: 协议精解与FPGA摄像头开发实战》-- CSI-2 协议详细解析 (一)

CSI-2 协议详细解析 (一&#xff09; 1. CSI-2层定义&#xff08;CSI-2 Layer Definitions&#xff09; 分层结构 &#xff1a;CSI-2协议分为6层&#xff1a; 物理层&#xff08;PHY Layer&#xff09; &#xff1a; 定义电气特性、时钟机制和传输介质&#xff08;导线&#…...

AtCoder 第409​场初级竞赛 A~E题解

A Conflict 【题目链接】 原题链接&#xff1a;A - Conflict 【考点】 枚举 【题目大意】 找到是否有两人都想要的物品。 【解析】 遍历两端字符串&#xff0c;只有在同时为 o 时输出 Yes 并结束程序&#xff0c;否则输出 No。 【难度】 GESP三级 【代码参考】 #i…...

渗透实战PortSwigger靶场-XSS Lab 14:大多数标签和属性被阻止

<script>标签被拦截 我们需要把全部可用的 tag 和 event 进行暴力破解 XSS cheat sheet&#xff1a; https://portswigger.net/web-security/cross-site-scripting/cheat-sheet 通过爆破发现body可以用 再把全部 events 放进去爆破 这些 event 全部可用 <body onres…...

如何在看板中有效管理突发紧急任务

在看板中有效管理突发紧急任务需要&#xff1a;设立专门的紧急任务通道、重新调整任务优先级、保持适度的WIP&#xff08;Work-in-Progress&#xff09;弹性、优化任务处理流程、提高团队应对突发情况的敏捷性。其中&#xff0c;设立专门的紧急任务通道尤为重要&#xff0c;这能…...

优选算法第十二讲:队列 + 宽搜 优先级队列

优选算法第十二讲&#xff1a;队列 宽搜 && 优先级队列 1.N叉树的层序遍历2.二叉树的锯齿型层序遍历3.二叉树最大宽度4.在每个树行中找最大值5.优先级队列 -- 最后一块石头的重量6.数据流中的第K大元素7.前K个高频单词8.数据流的中位数 1.N叉树的层序遍历 2.二叉树的锯…...

如何在网页里填写 PDF 表格?

有时候&#xff0c;你可能希望用户能在你的网站上填写 PDF 表单。然而&#xff0c;这件事并不简单&#xff0c;因为 PDF 并不是一种原生的网页格式。虽然浏览器可以显示 PDF 文件&#xff0c;但原生并不支持编辑或填写它们。更糟的是&#xff0c;如果你想收集表单数据&#xff…...

Python 包管理器 uv 介绍

Python 包管理器 uv 全面介绍 uv 是由 Astral&#xff08;热门工具 Ruff 的开发者&#xff09;推出的下一代高性能 Python 包管理器和构建工具&#xff0c;用 Rust 编写。它旨在解决传统工具&#xff08;如 pip、virtualenv、pip-tools&#xff09;的性能瓶颈&#xff0c;同时…...

使用Matplotlib创建炫酷的3D散点图:数据可视化的新维度

文章目录 基础实现代码代码解析进阶技巧1. 自定义点的大小和颜色2. 添加图例和样式美化3. 真实数据应用示例实用技巧与注意事项完整示例(带样式)应用场景在数据科学和可视化领域,三维图形能为我们提供更丰富的数据洞察。本文将手把手教你如何使用Python的Matplotlib库创建引…...

JavaScript基础-API 和 Web API

在学习JavaScript的过程中&#xff0c;理解API&#xff08;应用程序接口&#xff09;和Web API的概念及其应用是非常重要的。这些工具极大地扩展了JavaScript的功能&#xff0c;使得开发者能够创建出功能丰富、交互性强的Web应用程序。本文将深入探讨JavaScript中的API与Web AP…...

C++.OpenGL (20/64)混合(Blending)

混合(Blending) 透明效果核心原理 #mermaid-svg-SWG0UzVfJms7Sm3e {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-SWG0UzVfJms7Sm3e .error-icon{fill:#552222;}#mermaid-svg-SWG0UzVfJms7Sm3e .error-text{fill…...