对象的函数解构

我们在前后端分离时,后端经常返回来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中的函数和数组补漏的更多相关文章

  1. Es6中箭头函数与普通函数的区别

    Es6中箭头函数与普通函数的区别? 普通function的声明在变量提升中是最高的,箭头函数没有函数提升 箭头函数没有属于自己的this,arguments 箭头函数不能作为构造函数,不能被new,没 ...

  2. es6中的函数

    ES6 允许为函数的参数设置默认值,即直接写在参数定义的后面. function log(x, y = 'World') { console.log(x, y); } log('Hello') // ...

  3. C语言中的函数、数组与指针

    1.函数:当程序很小的时候,我们可以使用一个main函数就能搞定,但当程序变大的时候,就超出了人的大脑承受范围,逻辑不清了,这时候就需要把一个大程序分成许多小的模块来组织,于是就出现了函数概念:  函 ...

  4. shell中的函数、数组、报警系统脚本

    1.shell中的函数 函数就是把一段代码整理到了一个小单元中,并给这个小单元起一个名字,当用到这段代码时直接调用这 个小单元的名字即可.格式: function f_name() {commond} ...

  5. ES6中箭头函数的作用

    我们知道在ES6中,引入了箭头函数,其本质就是等同有ES5中的函数.类似于下面的写法: let test1=() => “abc”; let test2=() => { return “a ...

  6. ES6中箭头函数与普通函数this的区别

    普通函数中的this: 1. this总是代表它的直接调用者, 例如 obj.func ,那么func中的this就是obj 2.在默认情况(非严格模式下,未使用 'use strict'),没找到直 ...

  7. ES6中对函数的扩展

    ES6一路扩展,字符串.数组.数值.对象无一“幸免”,ES6说要雨露均沾,函数也不能落下,今天,就来讲解ES6对函数的扩展. 参数的默认值 在开发中,给函数的参数指定默认值,是很普遍很常见的一个需求, ...

  8. 阿里前端测试题--关于ES6中Promise函数的理解与应用

    今天做了阿里前端的笔试题目,原题目是这样的 //实现mergePromise函数,把传进去的数组顺序先后执行,//并且把返回的数据先后放到数组data中 const timeout = ms => ...

  9. shell中的函数、数组

    函数定义: 数组:

随机推荐

  1. sitecore系列教程之简单和个性化

    现代Web开发倾向于关注内容管理系统(CMS)的功能丰富的程序.最终用户可以做什么?作为内容管理者,我们可以为最终用户实现其目标提供哪些功能?开发人员可以为内容管理员构建哪些组件来实现它们? 相关内容 ...

  2. .py文件 改成默认用idle打开

    A.右键.py文件,edit with idle ==================================B.如果没有这个选项: 选择打开方式,进入python安装路径,选择 Python ...

  3. 为什么我们要使用HTTP Strict Transport Security?

    http://www.freebuf.com/articles/web/66827.html

  4. Chrome浏览器相关细节整理

    一.上传文件卡死 可能时由于输入法的原因导致上传文件浏览器卡死.将输入法改为英文模式再操作上传文件就不会卡死了.

  5. Linux基础命令---显示树形进程pstree

    pstree pstree显示正在运行的进程的树形结构,树以PID为根:如果省略了pid则以init为根.如果指定了用户名,则显示根植于该用户拥有的进程的所有进程树.如果pstree被调用为pstre ...

  6. win7 怎么设置开机直接进入桌面? netplwiz 命令

    电脑没设置密码,开机如何跳过帐户已锁定的界面,直接进入桌面呢? 1.单击[运行],或按快捷键:win+r2.输入命令:netplwiz 单击[确定]3.单击你的登录账户4.去掉[要使用本机,用户名必须 ...

  7. 1分钟完美安装最新CentOS+Nginx+PHP-FPM+MySQL

    PHP 5.3.1 MySQL 5.0.89 Nginx 0.8.33 或 0.7.65 (可选) 现在,我们可以快速全自动搞定 CentOS + Nginx + PHP-FPM + MySQL 的安 ...

  8. python requests接口测试

    Python 标准库中的 urllib2 模块提供了你所需要的大多数 HTTP 功能,但是它的 API 太渣了.它是为另一个时代.另一个互联网所创建的.它需要巨量的工作,甚至包括各种方法覆盖,来完成最 ...

  9. python里面的xlrd模块

    ♦python操作excel主要用到xlrd和xlwt这两个库,即xlrd是读excel,xlwt是写excel的库. 今天就先来说一下xlrd模块: 一.安装xlrd模块 ♦ 到python官网下载 ...

  10. python协程之动态添加任务

    https://blog.csdn.net/qq_29349715/article/details/79730786 python协程只能运行在事件循环中,但是一旦事件循环运行,又会阻塞当前任务.所以 ...