ES6中的函数和数组补漏
对象的函数解构
我们在前后端分离时,后端经常返回来JSON格式的数据,前端的美好愿望是直接把这个JSON格式数据当作参数,传递到函数内部进行处理。ES6就为我们提供了这样的解构赋值。
let json = {
a:'xzblogs',
b:'小智'
}
function fun({a,b='如果没有b用这个替补'}){
console.log(a,b);
}
fun(json);
是不是感觉方便了很多,我们再也不用一个个传递参数了。
数组的函数解构
函数能解构JSON,那解构我们的数组就更不在话下了,我们看下边的代码。我们声明一个数组,然后写一个方法,最后用…进行解构赋值。
let arr = ['xzblogs','小智','zachary'];
function fun(a,b,c){
console.log(a,b,c);
}
fun(...arr);
in的用法
in是用来判断对象或者数组中是否存在某个值的。我们先来看一下用in如何判断对象里是否有某个值。
对象判断
let obj={
a:'xzblogs',
b:'小智'
}
console.log('a' in obj); //true
数组判断
先来看一下ES5判断的弊端,以前会使用length属性进行判断,为0表示没有数组元素。但是这并不准确,或者说真实开发中有弊端。
let arr=[,,,,,];
console.log(arr.length); //
上边的代码输出了5,但是数组中其实全是空值,这就是一个坑啊。那用ES6的in就可以解决这个问题。
let arr=[,,,,,];
console.log(0 in arr); //false let arr1=['xz','小智'];
console.log(0 in arr1); // true
注意:这里的0指的是数组下标位置是否为空。
数组的遍历方法
1.forEach
let arr=['xzblogs','小智','zachary'];
arr.forEach((val,index)=>console.log(index,val));
forEach循环的特点是会自动省略为空的数组元素,相当于直接给我们筛空了。当是有时候也会给我们帮倒忙。
2.filter
let arr=['xzblogs','小智','zachary'];
arr.filter(x=>console.log(x));
这种方法在Vue实战里我讲过,他其实也有循环的功能,这里我们在复习一遍。
3.some
let arr=['xzblogs','小智','zachary'];
arr.some(x=>console.log(x));
4.map
let arr=['xzblogs','小智','zachary'];
console.log(arr.map(x=>'web'));
map在这里起到一个替换的作用,这个我们后续课程会详细讲解。
数组转换字符串
在开发中我们经常会碰到把数组输出成字符串的形式,我们今天学两种方法,你要注意两种方法的区别。
join()方法
let arr=['xzblogs','小智','zachary'];
console.log(arr.join('|'));
join()方法就是在数组元素中间,加了一些间隔,开发中很有用处。
toString()方法
let arr=['xzblogs','小智','zachary'];
console.log(arr.toString());
转换时只是是用逗号隔开了。
ES6中的函数和数组补漏的更多相关文章
- Es6中箭头函数与普通函数的区别
Es6中箭头函数与普通函数的区别? 普通function的声明在变量提升中是最高的,箭头函数没有函数提升 箭头函数没有属于自己的this,arguments 箭头函数不能作为构造函数,不能被new,没 ...
- es6中的函数
ES6 允许为函数的参数设置默认值,即直接写在参数定义的后面. function log(x, y = 'World') { console.log(x, y); } log('Hello') // ...
- C语言中的函数、数组与指针
1.函数:当程序很小的时候,我们可以使用一个main函数就能搞定,但当程序变大的时候,就超出了人的大脑承受范围,逻辑不清了,这时候就需要把一个大程序分成许多小的模块来组织,于是就出现了函数概念: 函 ...
- shell中的函数、数组、报警系统脚本
1.shell中的函数 函数就是把一段代码整理到了一个小单元中,并给这个小单元起一个名字,当用到这段代码时直接调用这 个小单元的名字即可.格式: function f_name() {commond} ...
- ES6中箭头函数的作用
我们知道在ES6中,引入了箭头函数,其本质就是等同有ES5中的函数.类似于下面的写法: let test1=() => “abc”; let test2=() => { return “a ...
- ES6中箭头函数与普通函数this的区别
普通函数中的this: 1. this总是代表它的直接调用者, 例如 obj.func ,那么func中的this就是obj 2.在默认情况(非严格模式下,未使用 'use strict'),没找到直 ...
- ES6中对函数的扩展
ES6一路扩展,字符串.数组.数值.对象无一“幸免”,ES6说要雨露均沾,函数也不能落下,今天,就来讲解ES6对函数的扩展. 参数的默认值 在开发中,给函数的参数指定默认值,是很普遍很常见的一个需求, ...
- 阿里前端测试题--关于ES6中Promise函数的理解与应用
今天做了阿里前端的笔试题目,原题目是这样的 //实现mergePromise函数,把传进去的数组顺序先后执行,//并且把返回的数据先后放到数组data中 const timeout = ms => ...
- shell中的函数、数组
函数定义: 数组:
随机推荐
- python: numpy--函数 shape用法
http://blog.csdn.net/u010758410/article/details/71554224 shape函数是numpy.core.fromnumeric中的函数,它的功能是查看矩 ...
- arc 092C 2D Plane 2N Points
题意: 有n个红色的点和n个蓝色的点,如果红色的点的横坐标和纵坐标分别比蓝色的点的横坐标和纵坐标小,那么这两个点就可以成为一对友好的点. 问最多可以形成多少对友好的点. 思路: 裸的二分图匹配,对于满 ...
- cmd强行终止进程
找到某个进程对应的端口号 Netstat -ano|findstr 8080 通过ip 地址,强行 taskkill /PID 11048 但有的情况下终止不了,需要通过下列方式进行 task ...
- 【转】Apache Kylin 2.0为大数据带来交互式的BI
本文转载自:[技术帖]Apache Kylin 2.0为大数据带来交互式的BI 编者注:Kyligence的联合创始人兼CEO Luke Han在上做题为“”的演讲. 基于Hadoop的SQL一直在被 ...
- Web前端开发(基础学习+坑)
0.基本说明 0.内容为课堂所学基本知识,加自己踩过的坑 1.web基本框架:html+css+JavaScript,html为网页骨架,css为网页美化,JavaScript负责页面动态交互,脚本等 ...
- Java用Gson按照键值key排序json所有节点
<dependency> <groupId>commons-io</groupId> <artifactId>commons-io</artifa ...
- cms STW 的两个阶段
CMS在初始标记和重复标记阶段会停顿
- 第二节 JavaScript基础
JavaScript组成及其兼容性: ECMAScript:解释器,翻译,用于实现机器语言和高级语言的翻译器:几乎没有兼容性问题 DOM(Document Object Model):文档对象模型,文 ...
- P2P原理及UDP穿透简单说明(转)
源: P2P原理及UDP穿透简单说明
- fjwc2019 D6T1 堆(组合数+打表)
#193. 「2019冬令营提高组」堆 但是每个点都遍历一遍,有些点的子树完全相同却重复算了 忽然记起完全二叉树的性质之一:每个非叶节点的子树中至少有一个是满二叉树 那么我们预处理满二叉树的那一块,剩 ...