python数列求和-加强版_ES6深入浅出-3 三个点运算 新版字符串-1.函数与对象的语法糖...
主要讲的内容
时间充裕的话就讲,模板字面量
默认参数值
首先讲es6之前,我们是怎么做的。例如我们要写一个求和的函数,
请两个参数的和,但是如果有的人就是穿一个参数呢?
那么b没有传值,b的值是多少呢?打印出来就是undefined。NaN就是a+b的值
所以我们要处理b这个参数。b等于b或者是0,这是一个缩写的形式。基本上所有es5的前端都会去这么写,默认参数
上面的一行简写的方式等于下面if else的方式。
b赋值b给b有什么用?就是为了形式好看而已。如果b不存在就让他等于0
或的逻辑就是一个短路逻辑,前面如果是一个真值,就直接取b的值,交给b。如果前面b是个假值,就看第二个的值,把第二个的值交给b。
就是这么个意思,这就是一个取默认值的惯用写法。所以Es5的写法让人很难懂。
那么a和b如果你不传的话,哪个不传,哪个就是0
只传一个1。结果是1
传1和2
如果我要求四个数值的和。那么就要判断四遍
es6的语法。
如果a或者b的值等于undefined。那么默认就是0
相当于是这种旧的方法。if判断b的值是否是undefined
两个都不传,0+0就是0
以上就是默认参数。
函数默认参数和python的区别
如果你没有给我传第二个参数。那么我就给第二个参数一个默认值
传一个1过去。数组内的结果最终返回的就是1
1放的空数组和2放的空数组。是同一个空数组吗?
所以每次进push函数的时候,它都是一个新的空数组。
python并不是这样的。数组是共有的,每次调用这个数组,只初始化一次。js里面,每次都是新的数组,这就是两者之间的区别。
剩余参数
要求很多个参数的和,但是并不知道传递几个参数进来。
es5里面的写法。arguments就是所有的参数
arguments是一个伪数组,它的原型链直接到了这个对象,,只有数组的样子,没有数组的方法。
arguments是有个伪数组,它的原型链直接到了这个对象,看下面的__proto__:Object
循环argumens求和
假设第一个参数,我们传一个前缀进去。
因为第一个参数是传递的信息,所以循环arguments的时候 从1开始求和。不再是从0开始了。
三个点
三个点后面加参数,就表示后面所有的参数都统一的放到numbers这个数组里面。
打印出来numbers的值
这样求和就是循环numbers这个数组了。
简写的形式,因为numbers是一个真的数组。reduce方法是计算数组元素相加后的综合。reduce的第二个参数,是可选的,表示初始值,这里给的初始值是0
reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
伪数组转数组
没有剩余参数的话。那么怎么获取到后面的所有参数呢?通过arguments.slice从第一个参数开始切 一直到最后一个。问题在于arguments是一个伪数组,它没有slice方法。所以第一步就应该把arguments变成一个数组。
很遗憾es5没有给我们提供一个好的方法,把一个伪数组变成数组。下面一句话是前端程序员看了所有的api后,发现一个最方便的,es5里面把一个arguments从一个伪数组变成一个真数组的方式。
这一句是es6里面提供新的方法,把一个伪数组编程一个数组的方法。
更简单的方式。前面加三个点表示把1到10这10个参数都放到新的数组里面。
打印出了args,那么它是不是一个真的数组呢?
在concole内查看,args的原型就是一个数组,
最简单的方式
展开操作
array2是array1的后三项
a对应的上面的1,b对应2,c对应3,...array2表示后面都包了。abc其实是三个占位符,表示占了前面三个元素,那么array2只能去后面的456这三个元素了,array2就是456
那么array2的值输出就是 456
前面三个用逗号省略掉了。这叫做模式匹配。
复制一个array1。但是这样没有什么意义。直接写array2=array1就可以。
在array1前面加0 后面加7.
es5的写法。用数组0链接数组1,再链接数组7
解构赋值
把a和b的值相互调换,需要用到第三个变量。
es6的写法,借助,数组,让左边的第0项等于右边数组的第0项,让左边的第1项等于右边数组的第1项,
所以括号往上走。b的值就变成了这样。这就是为什么写js的代码。每一行后面都要加分号的原因了。如果不加的话,括号会自动往上走
b是数组3
因为括号往上走了,直接等于了最后的[3]
让a等于10,b等于20,rest等于后面的 30,40,50。这是解构赋值的写法,从等号右边的数组解构。
解构对象
es5的语法
es6的语法糖。表示从frank里面取name、age、gender。然后这三个东西分别声明一个变量。
这就是解构赋值。把frank的结构解开,然后分别赋值给name、age、gender
写成一行的方式
a等于1,b等于2
如果没有2,那么b就undefined了。如果想给b一个默认值呢?
如果没有b,那么b就等于7
如果b有值,那么b就等于2
所以5和7是 a和b的默认值
声明一个函数,你可以就看到这样的语法。主要看f函数的返回值是什么。所以结果就是a=1 b=2
解构赋值,取了个别名。解构赋值取的是name,但是把name重命名成xingming
那么有没有这个name的值呢?windows自带了name。所以这里我们把name都换成name2这个变量名,打印name2就会报错。
继续再复杂一点的 -子对象
假设frank有孩子,现在想取他的孩子的名字tom该怎么取呢?
先取出child,再从child里面取出name
child的name起个别名。这里只有xingming这个变量被声明了。
输出child报错。它并没有被声明,只声明了name、age、gender这三个变量
综合语法
如果孩子刚出生,没有起名字,也就没有name这个属性值,给name属性一个默认值为Tom
如果有名字,就是里面的那个名字
这里的frank是被解构的对象。
拷贝对象
把objA的属性,一个一个的全拷贝过来。
a是字符串被完整的拷贝过来了。
全拷贝,没有把这个对象拷贝过来,只是把这个对象的地址拷贝过来了。
改了B的值但是A的值也被改了。全拷贝就是大家共用对象。
不讲深拷贝。因为做不到。所有深拷贝的答案都是错的
方便的方法做全拷贝
把objeA所有的属性都拷贝过来。
打印拷贝后的B。这就是把A的所有的属性,全拷贝过来。
做对象合并
定义A和C。现在要合并A和C。只看下面两个红框内的代码。最下面的代码是没有修改的。
以前的写法,先把A的拷贝过来,再把C的拷贝过来。后面的属性会覆盖前面的属性。
最后p1的值是C的。
三个点的写法
把A的属性拷贝过来,在把C的属性拷贝过来。C在后面会覆盖前面的属性。
MDN 上更多的例子
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#%E5%87%BD%E6%95%B0%E5%8F%82%E6%95%B0%E9%BB%98%E8%AE%A4%E5%80%BC
这是深拷贝。如果这个对象满足以下条件就是深拷贝
第一个这个对象没有复杂的对象。没有日期对象,没有正则对象。没有函数,没有循环引用,没有所有普通对象之外的对象,
第二个条件:这个对象没有Undefined
‘
不适用于复杂对象的深拷贝。
如果面试官问你,写一个能是适应于复杂对象的深拷贝。回答:递归,可以参考别人写的算法,理解着背下来。
字符串
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#%E8%A7%A3%E6%9E%84%E5%AF%B9%E8%B1%A1
这是一个es5版本的字符串处理。它接收一个对象,判断这个对象是不是一个undefined,如果是undefined就把这个对象初始化成一个空对象,如果不是undefined就不变它。
它要取options里面的size,还要判断options里面的size是不是undefined如果是undefined就默认取big。如果不是undefined就不管它
function drawES5Chart(options) {
options = options === undefined ? {} : options;
var size = options.size === undefined ? 'big' : options.size;
var cords = options.cords === undefined ? { x: 0, y: 0 } : options.cords;
var radius = options.radius === undefined ? 25 : options.radius;
console.log(size, cords, radius);
// now finally do some chart drawing
}
drawES5Chart({
cords: { x: 18, y: 30 },
radius: 30
});
首先参数默认值就是一个空对象。
左边这一堆东西默认值是空对象。
来解构一下。取这个对象的size如果没有那么就默认为big。取cords对象,如果就默认为{ x: 0, y: 0 }。取radius如果没有就是25
function drawES2015Chart({size = 'big', cords = { x: 0, y: 0 }, radius = 25} = {})
{
console.log(size, cords, radius);
// do some chart drawing
}
drawES2015Chart({
cords: { x: 18, y: 30 },
radius: 30
});
一步一步来解析
把取的第一个参数命名为a,如果a不存在,那就给a默认值为空对象{}
这个a我要给它解构一下,分别是size、cords、radius
同时要给解构的这几个值 分别一个默认值
推荐的写法,定义总的变量为options。然后里面再去解构options这个变量
合构-属性加强
和解构相反的操作。
假设有两个变量叫做x和y。把他俩合成一个对象。这就是把他合起来。
es6的语法糖
变量和值相同 就直接写一个。
解构都是在等号的左边,右边是被解构的对象
function的简化写法
如果要加参数
从别的地方拷贝obj1对象。
一个对象的属性和方法,下面是四种写法
以前的函数写法
还可以给方法的参数加默认值
最后一个例子-动态key值
想声明一个对象,给你一个key
需要你声明一个对象 有这个key
这么写他的key就是字符串key。而不是变量key
我们很难把一个变量变成一个key,一旦我们把变量写在那里,它自动的就变成了字符串。因为js他的字符串是可以隐藏的
所以js程序员一直以来,想要动态的添加key的时候,只能这么去添加
es6语法糖
把key作为一个变量,然后取key这个变量的值。
同时还可以做运算。key+key就是两个x
以上就是动态的key值
结束
python数列求和-加强版_ES6深入浅出-3 三个点运算 新版字符串-1.函数与对象的语法糖...相关推荐
- 7-11 数列求和-加强版 (20 分)
7-11 数列求和-加强版 (20 分) 给定某数字A(1≤A≤9)以及非负整数N(0≤N≤100000),求数列之和S=A+AA+AAA+⋯+AA⋯A(N个A).例如A=1, N=3时,S=1+11 ...
- 7-38 数列求和-加强版(20 分)
7-38 数列求和-加强版(20 分) 给定某数字A(1≤A≤9)以及非负整数N(0≤N≤100000),求数列之和S=A+AA+AAA+⋯+AA⋯A(N个A).例如A=1, N=3时,S=1+11+ ...
- assert函数_悉数Python函数传参的语法糖
TIOBE排行榜是程序开发语言的流行使用程度的有效指标,对世界范围内开发语言的走势具有重要参考意义.随着数据挖掘.机器学习和人工智能相关概念的风行,Python一举收获2018年年度语言,这也是Pyt ...
- python数列求和程序_python实现有趣的数学逻辑程序
1.无重复数字的三位数 题目:有1.2.3.4个数字, 能组成多少个互不相同且无重复数字的三位数? 都是多少? for i in range(1,5): for j in range(1,5): fo ...
- python数列求和1+11+111前n项_2020年《python程序设计》基础知识及程序设计598题IQ[含参考答案]...
2020年<python程序设计>基础知识及程序设计 598题[含参考答案] 一.填空题 1.表达式 len('abc'.ljust(20)) 的值为______________.(20) ...
- PTA基础编程题目集-7-38 数列求和-加强版
方法一:超时 #include<iostream> #include<algorithm> #include<cmath> #include<cstring& ...
- Python数据结构14:递归的原理,递归实现数列求和、求阶乘、十进制转为任意进制
1. 概念:什么是递归? 递归(Recursion)是一种解决问题的方法.尤其是复杂问题,有时用递归解决复杂问题可能会出奇的简单. 递归将一个比较复杂的问题分解成更小规模的问题,持续分解直到问题规模小 ...
- 从斐波那契数列求和想到的俗手、本手和妙手
数列求和的通常做法,用先求出数列的通项公式,然后循环累加求和.先以奇数集求和为例: 奇数列 fn = 2n-1,通项公式及求和公式都写成函数,即: def fn(n):return 2*n-1def ...
- python数字求和_python数字求和
广告关闭 腾讯云11.11云上盛惠 ,精选热门产品助力上云,云服务器首年88元起,买的越多返的越多,最高返5000元! 对于每个值,我右对齐值的位(忽略0b),计算1的数量,并移动1的数量. #!us ...
最新文章
- 【AJAX】JavaScript的面向对象
- Spring复习笔记:1
- ffmpeg加入libass
- Windows10安装python2.7.15版本,附过程问题解决方案
- 加载gif动图_【知乎编辑技巧】GIF动图 的插入 2020.05
- java注解的继承_Java注解合并,注解继承
- 几何画板菜单栏有哪些功能
- Jenkins与Docker的自动化CI/CD实战
- 《结对-结对编程项目作业名称-结对项目总结》
- 快读快写:读入输出优化
- 拓端tecdat|R语言缺失值的处理:线性回归模型插补
- php前台输出繁体,利用PHP输出控制功能做简繁体转换_php
- 软件测试的八股文内容
- python将英文翻译为中文_Python中英文翻译工具
- Html 设置整个页面的背景颜色
- OpenGL学习002-配置GLAD
- 【读书笔记】之蔡康永的说话之道2
- 我励志成为芸芸阿里云大使中的佼佼者 云大使社区
- 项目管理需要建立团队文化
- 复变函数 —— 0. 连接复数与三角函数的欧拉公式
热门文章
- MySQL安装最后一步apply security settings错误
- 同步手绘板——将View的内容映射成Bitmap转图片导出
- 链表栈-》与数组栈同接口-》更确切地说是单项链表的接口封装
- phpmyadmi 上传大文件
- 企业库应用实践系列三:自定义构造函数
- ASP.Net 使用css换肤(转)
- c语言dll注入,教大家写一个远程线程的DLL注入,其实还是蛮简单的……………………...
- rn+与android+交互,React native 与Android原生交互方式(一)
- 计算机连上网没网络连接,电脑显示本地网络连接但是宽带没连上怎么办? 爱问知识人...
- node 生产的env文件怎么注入_Node.js进阶之进程与线程