js查找数组所有符合条件数据-前端面试必备ES6全方位总结

掘金/魔王哪吒
大家好，我是魔王哪吒，话不多说，今天带来的是一篇《前端面试必备ES6全方位总结》文章，欢迎大家喜欢。

前言

学习ES6需要掌握的路线，了解什么是ECMAScript概述，了解Symbol数据类型，掌握let和const，以及变量的解构赋值，Set和Map的原理。

什么叫做箭头函数，ES6对于ES5都有哪些扩展，ES6的一些高级操作。

为了方便查看学习，我做了思维导图，如下图所示：

ESMAScript概述

ECMAScript是一种脚本程序设计语言，被称为JavaScript或是JScript。它的中文名为ECMAScript，英文名为European Computer Manufacturers Association Script，我们可以简称为ES6，其特点是万维网上应用广泛。

ECMAScript是网景的布兰登·艾克开发的一种脚本语言的标准化规范，最初命名为Mocha，后来改名为LiveScript，最后重命名为JavaScript。

1995年12月，升阳与网景联合发表了JavaScript。1996年11月js查找数组所有符合条件数据，网景公司将JavaScript提交给欧洲计算机制造商协会进行标准化。ECMA-262的第一个版本于1997年6月被Ecma组织采纳。

ECMA Script是ECMA-262标准化的脚本语言的名称。尽管JavaScript和JScript与ECMAScript兼容，但包含超出ECMA Script的功能。

ECMAScript是一种可以在宿主环境中执行计算并能操作可计算对象的基于对象的程序设计语言。ECMAScript最先被设计成一种Web脚本语言，用来支持Web页面的动态表现以及为基于Web的客户机—服务器架构提供服务器端的计算能力。

作为一种脚本语言，ECMAScript具备同其他脚本语言一样的性质，即“用来操纵、定制一个已存在系统所提供的功能，以及对其进行自动化”。

ECMAScript和JavaScript是什么关系呢？

简单来生活，ECMAScript是JavaScript语言的国际标准，JavaScript是ECMAScript是ECMAScript的实现。

Symbol数据类型

ES6引入一种新的原始数据类型为 Symbol ，表示为 独一无二 的值，用来定义独一无二的对象属性名。

Symbol的讲解

4个方面说说Symbol数据类型：

Symbol的定义；

Symbol作为对象属性名；

Symbol使用场景；

Symbol获取。

Symbol的定义

示例代码：

let s1 = Symbol('web');let s2 = Symbol('web');console.log(s1 === s2);console.log(typeof s1);console.log(typeof s2);

chrome截图：

由图可知：Symbol()函数接收的参数相同，其变量的值也不同，s1和s2是Symbol类型的变量，因为变量的值不同，所以打印的结果为false。使用typeof来获取相应的类型，所以打印的结果都为symbol。

Symbol作为对象属性名

Symbol可以通过三种方式作为对象属性名。

示例代码：

let symbol = Symbol();let a = {};a[symbol] = 'web';

由代码可知：首先声明了一个Symbol类型的变量symbol，一个空的对象为a，通过a[symbol]给a对象赋值一个web的字符串。表示symbol作为对象属性名，web作为它的属性值。

示例代码：

let symbol = Symbol();let a = {    [symbol]:'web'};

由代码可知：首先声明了一个Symbol类型的变量symbol，接着在声明对象a的同时通过[symbol]给a对象性赋值为web的字符串。

示例代码：

let symbol = Symbol();let a = {};Object.defineProperty(a, symbol, {value: 'web'});

由代码可知：首先声明了一个Symbol类型的变量symbol，一个空对象为a，通过Object.defineProperty()方法给a对象赋值为web的字符串。

Symbol的值作为对象属性名，是不能用点运算符的。

Symbol使用场景

一种有两种使用场景：

因为Symbol的值是均不相等的，所以Symbol类型的值作为对象属性名，不会出现重复。

代码形成强耦合的某一个具体的字符串。

Symbol获取

通过Object.getOwnPropertySymbols()方法，可以获取指定对象的所有Symbols属性名。

let和const

为什么需要块级作用域？

为什么会添加这个块级作用域，就得了解ES5没有块级作用域时出现的问题。

场景一是内层变量可能会覆盖外层变量。

场景二是在if或者是for循环中声明的变量会泄漏成为全局变量。

场景一：

场景二：

代码示例：

if(true) {  var web = 'web';}console.log(web); // web 没在iF块中也可以访问

块级作用域的前提是进行let变量声明

独立的一对大括号，两个大括号之间就是变量的块级作用域的范围。

条件语句，函数声明语句，循环语句等的一对大括号中就是变量的块级作用域范围。

const声明一个只读的常量。const一旦声明常量，其值不能被改变。

const和let只在声明的块级作用域内有效。否则会报错。

const命令声明的常量只能在声明的位置后面使用。

const声明的常量js查找数组所有符合条件数据，与let一样不可重复声明。

变量的解构赋值

在ES6中可以从数组和对象中提取值，对变量进行赋值，称为解构赋值。

解构赋值就是只要等号两边的模式相同，左边的变量就会被对应赋值。

示例代码：

let [x,y='b'] = ['a'];console.log(y); // b
let [x,y='b'] = ['a', undefined];console.log(y); // b
let [x,y='b'] = ['a', null];console.log(y); // null

解构赋值分类：
数组的解构赋值
对象的解构赋值
字符串的解构赋值
数字以及布尔值的解构赋值
函数参数的解构赋值
解构赋值的情况
两种情况：
完全解构
不完全解构
不完全解构
代码如下：
let [a = 1, b] = [];// a = 1, b = undefined



数组的解构赋值
代码如下：
let [a, [b], d] = [1, [2, 3], 4];a // 1b // 2d // 4

解构赋值允许指定默认值。

代码如下：
let [foo = true] = [];foo // true

在使用默认值的时候，应该注意undefined，因为undefined是不能赋值的。

代码如下：
let [x = 1] = [undefined];x // 1 let [x = 1] = [null];x // null

对象解构

代码如下：
let { bar, foo } = { foo: 'aaa', bar: 'bbb' };foo // "aaa"bar // "bbb" let { baz } = { foo: 'aaa', bar: 'bbb' };baz // undefined

通过解构，我们可以很容易的把对象的方法复制给变量。

代码如下：
const { log } = console;log('hello') // hello

或者是：
const { log:minelog } = console;minelog ('hello') // hello

当我们使用解构赋值的时候，需要注意声明变量的作用域问题：


// 错误的写法let x;{x} = {x: 1}; // 正确的写法let x;
({x} = {x: 1});


数组中是一个特殊的对象


let arr = [1, 2, 3];let {0 : first, [arr.length - 1] : last} = arr;first // 1last // 3

不完全解构


let obj = {p: [{y: 'world'}] };let {p: [{ y }, x ] } = obj;// x = undefined// y = 'world'



剩余运算符
let {a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40};// a = 10// b = 20// rest = {c: 30, d: 40}



解构默认值
let {a = 10, b = 5} = {a: 3};// a = 3; b = 5;let {a: aa = 10, b: bb = 5} = {a: 3};// aa = 3; bb = 5;



字符串解构
字符串本身也是一个对象，有时候，可以当成一个数组解构
代码如下：
const [a, b, c, d, e] = 'hello';a // "h"b // "e"c // "l"d // "l"e // "o"



当做一个对象解构
let {length : len} = 'hello';len // 5

剩余运算符
let [a, ...b] = [1, 2, 3];//a = 1//b = [2, 3]

函数参数的解构赋值


function add([x, y]){  return x + y;} add([1, 2]); // 3

计算函数任意个参数之和：

代码：
function sum(...num){    var sumNum = 0;    for(let i=0;i<num.length;i++){        sumNum += parseInt(num[i])    }    console.log(sumNum)}



Set和Map
Set类似于数组，但是成员的值都是唯一的，没有重复的值。
Set使用add()方法添加元素，不会添加重复的值，所以Set可以对数组进行去重操作。
Map类似于对象，键名的值可以是各种类型的值。
限 时 特 惠： 本站每日持续更新海量各大内部创业教程，一年会员只需98元，全站资源免费下载 点击查看详情

站 长 微 信： qihangxm102
声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，请联系我们进行处理。
变量声明数组

	

		

            
                            
                    admin普通                
            			
		
		


            
			 收藏            
			                 海报
                        
             链接