ES6-12 array/数值拓展、ArrayOf、ArrayFrom

要使用…须有迭代器接口

数组方法

在这里插入图片描述

构造器上的方法

Array.of()声明数组

  • 替代new Array()的方式声明数组
  • new Array()不传参数返回空数组,只传1个参数时,代表数组长度,内容用empty填充,传多个参数,则代表数组内容,容易有歧义
console.log(new Array()) // []
console.log(new Array(1)) // [empty]
console.log(new Array(1, 2, 3)) // [1, 2, 3]
console.log(Array()) // 不写new 效果相同 []
console.log(Array(1)) // [empty]
console.log(Array.of()) // []
console.log(Array.of(1)) // [1]
console.log(Array.of(1, 2, 3)) // [1, 2, 3]

Array.from() 转换为真正的数组

  • Array.from() 方法从一个类似数组或可迭代对象创建一个新的,浅拷贝的数组实例

  • 语法 Array.from(arrayLike[, mapFn[, thisArg]])
    mapFn 可选:如果指定了该参数,新数组中的每个元素会执行该回调函数。
    thisArg 可选:可选参数,执行回调函数 mapFn 时 this 对象。

  • 类数组,打印出来和数组没什么区别,但不是数组

在这里插入图片描述

let obj = {start: [1, 3, 2, 4],end: [5, 7, 6],[Symbol.iterator]() {let index = 0,arr = [...this.start, ...this.end],len = arr.length;return {next() {if (index < len) {return {value: arr[index++],done: false}} else {return {value: undefined,done: true}}}}}
}
console.log(Array.from(obj)) //  [1, 3, 2, 4, 5, 7, 6]
console.log(Array.from(obj,function (val,idx) {return `第${idx}个:${val}`
}))
// ["第0个:1", "第1个:3", "第2个:2", "第3个:4", "第4个:5", "第5个:7", "第6个:6"]

原型上的方法

ES6新增有:[].fill() copyWithin() keys() / values() / entries() includes() find() / findIndex()

arr.fill() 左闭右开

  • fill() 方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引。[ , )
  • 修改原数组
  • 如果start和end索引相同/或者是非数,则不操作
  • 不写end/end超出长度,就填充直到结束
[1, 2, 3].fill(4);               // [4, 4, 4]
[1, 2, 3].fill(4, 1);            // [1, 4, 4]
[1, 2, 3].fill(4, 1, 2);         // [1, 4, 3]
[1, 2, 3].fill(4, 1, 1);         // [1, 2, 3]
[1, 2, 3].fill(4, 3, 3);         // [1, 2, 3]
[1, 2, 3].fill(4, -3, -2);       // [4, 2, 3]
[1, 2, 3].fill(4, NaN, NaN);     // [1, 2, 3]
[1, 2, 3].fill(4, 3, 5);         // [1, 2, 3]
Array(3).fill(4);                // [4, 4, 4]
[].fill.call({ length: 3 }, 4);  // {0: 4, 1: 4, 2: 4, length: 3}// Objects by reference.
var arr = Array(3).fill({}) // [{}, {}, {}];
// 需要注意如果fill的参数为引用类型,会导致都执行都一个引用类型
// 如 arr[0] === arr[1] 为true
arr[0].hi = "hi"; // [{ hi: "hi" }, { hi: "hi" }, { hi: "hi" }]

keys() / values() / entries()

  • 返回值是迭代器对象
  • 迭代器对象的原型上有next方法
  • 迭代器对象没有length属性,不能用for循环遍历
const arr = [1, 2, 3]
const itKeys = arr.keys()
const itVals = arr.values()
const itEntries = arr.entries()
console.log(itKeys)
console.log(itVals)
console.log(itEntries)
console.log(itKeys.next())
console.log(itKeys.next())
console.log(itKeys.next())
console.log(itKeys.next())
console.log('剩余运算符展开',[...arr.keys()])console.log(itVals.next())
console.log(itVals.next())
console.log(itVals.next())
console.log(itVals.next())
console.log('剩余运算符展开',[...arr.values()])console.log(itEntries.next())
console.log(itEntries.next())
console.log(itEntries.next())
console.log(itEntries.next())
console.log('剩余运算符展开',[...arr.entries()])

在这里插入图片描述

在这里插入图片描述

copyWithin

  • 浅复制数组的一部分到同一数组中的另一个位置,并返回它,不会改变原数组的长度。
  • copyWithin(target,start,end)
  • target从哪里开始被替换
  • start原数组从哪开始
  • end原数组到哪结束
const arr = [1, 2, 3, 4]
console.log(arr.copyWithin(2, 0)) // [1,2,1,2]

在这里插入图片描述

console.log([].copyWithin.call({ length: 5, 3: 1 }, 0, 3))
// 没有用undefined进行填充,没有对没有的index进行填充

在这里插入图片描述

console.log([].copyWithin.call({ length: 5, 3: 1, 4: 1}, 0, 3))

在这里插入图片描述

ES6解决了NaN本身不相等而影响判断结果的问题

find/findIndex

  • find返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。
  • findIndex返回数组中满足提供的测试函数的第一个元素的索引。若没有找到对应元素则返回-1。
  • 接收参数:callback(val,idx,arr),[thisArg]
const arr = [NaN]
console.log(arr.indexOf(NaN)) // -1 找不到,NaN与自身也不相等
console.log(arr.findIndex((val) => Object.is(val, NaN))) // 0 找到
console.log(arr.findIndex((val) => isNaN(val))) // 0 找到

includes

  • 判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回false。
const arr = [NaN]
console.log(arr.includes(NaN)) // true

数值拓展

  • 二进制binary
  • 八进制Octal
  • 十六进制 hex
  • 新增二进制/八进制表示方法
  • 二进制0b开头,八进制0O开头
// 十进制16转为二进制 
console.log((16).toString(2)) // 10000
// 直接表示这个二进制数
console.log(0b10000) // 16 打印结果是十进制的
// 十进制16转为八进制 
console.log((16).toString(8)) // 20
// 直接表示这个八进制数
console.log(0O20) // 16 打印结果是十进制的
  • ES5就有的十六进制是0x开头的
  • 都不区分大小写
  • parseInt、isNaN等方法在ES5中是定义在全局的,ES6中在Number的构造器上可看到这些方法的定义,也解决了全局方法的一些问题
    在这里插入图片描述

isNaN 隐式转换

console.log(isNaN('NaN')) // true,隐式转换,得到了不符合预期的结果
console.log(Number.isNaN('NaN')) // false

isFinite是有限的

console.log(isFinite(NaN)) // false
console.log(isFinite(Infinity)) // false
console.log(isFinite('42')) // true 隐式转换
console.log(Number.isFinite('42')) // false

isInteger是整数

console.log(Number.isInteger(24)) // true
console.log(Number.isInteger(24.0)) // true js认为这是整数
console.log(Number.isInteger(24.1)) // false

isSafeInteger 安全整数

  • 安全整数的范围
console.log(Number.MAX_SAFE_INTEGER === Math.pow(2, 53) - 1) // 2的53次方 true
console.log(Number.MIN_SAFE_INTEGER === -Math.pow(2, 53) + 1) // true

Math对象

  • 内置对象Math没有prototype
    在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/251003.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

React01

目录 React-day01 入门知识React介绍官网React开发环境初始化 SPA脚手架初始化项目&#xff08;方便&#xff0c;稳定&#xff09;*通过webpack进行初始化配置镜像地址开发工具配置元素渲染组件及组件状态函数定义组件(无状态)类定义组件(有状态)*组合组件Props属性*State状态*…

算法 --- 反转数组

几个注意点: 1.输出的时候,也要做数字超出处理 2.js中可以使用 str -0 将字符串类型转换成数字类型 ( 注意不是 0) 3.可以使用 num ‘’ 将数字类型转换成字符串类型 4.使用str.split(’’) 可以将字符串转换成数组 5.使用arr.join(’’) 可以将数组转换成字符串 6.JS中2的31次…

ES6-13 正则方法、修饰符yus、UTF_16编码方式

修饰符 m multiLine 对于str中含\n的情况g globali ignoreCase 元字符 反斜杠加转义 元字符含义简写\w匹配字母、数字、下划线。等价于’[A-Za-z0-9_]’。word\W匹配非字母、数字、下划线。等价于 ‘[^A-Za-z0-9_]’。\s匹配任何空白字符&#xff0c;包括空格、制表符、换页…

cmd窗口快速定位到具体文件夹方法

在用Python进行机器实战时&#xff0c;打开cmd窗口后&#xff0c;总是到定位到kNN.py所在文件夹才能Python&#xff08;否则import kNN失败&#xff09;&#xff0c;每次都要输入地址非常麻烦 这里介绍一个cmd窗口快速定位到具体文件夹方法&#xff1a; 按住Shift键右击鼠标打开…

算法 --- 罗马数字转整数

解体思路: 1.写一个对象trans用于保存罗马和数字之间的映射关系 2.重点在于当数值小的出现在数值大的左边时,会减去该数,出现在右边时会加上该数,因此需要与后面的进行比较 3.在得到s时,首先给它转换成字符串,并在末位加一个0 /*** param {string} s* return {number}*/ var r…

正则 - 阮一峰

学习地址 一 正则实例方法 1. test 正则实例.test返回布尔值 var r /x/g; var s _x_x;r.lastIndex // 0 r.test(s) // truer.lastIndex // 2 r.test(s) // truer.lastIndex // 4 r.test(s) // false死循环&#xff0c;因为while循环的每次匹配条件都是一个新的正则表达式…

算法 --- 有效的括号

解题思路: 1.对括号分别赋值(左括号大于0,右括号小于0),方便后期比较 2.使用栈,对于大于0的字符串入栈,对于小于0的字符串,检查栈中是否有元素,若没有返回false,否则拿出栈顶的一个元素,和现在的元素进行比较 /** * param {string} s * return {boolean} */ var isValid func…

ES6-14 Unicode表示法、字符串方法、模板字符串

Unicode表示法 本身能正常识别的&#xff0c;加{}也能识别&#xff0c;花括号内的内容表示码点 parseInt(0061,16) // 十进制的97&#xff0c;97在ASCII码中对应a console.log(\u0061) // a console.log(\u{0061}) // a console.log(\u{61}) // a原型上方法 codePointAt(十进…

算法 --- 删除数组中重复项

解题思路: 如果输入的数组长度为1,则返回该数组否则(len>2),使用i记录当前待插入的位置,j记录下一个与nums[i]不相等的位置,leng为待返回数组的长度当nums[i] ! nums[j]时,把j位置的值nums[j]放在i1位置.同时i,j /*** param {number[]} nums* return {number}*/ var remov…

如何理解 Linux 中的 load averages

原文&#xff1a;https://mp.weixin.qq.com/s?src11&timestamp1533697106&ver1047&signaturepoqrJFfcNABv4biKKpa4mZdIW7No2Wo1F5sbZL7ggoVS2GqcSqwQQ8hMulAmezT*zL*klB-eE5BeMyNuyjuIH7YgkBAN25i6*ahhEpWyxqx6vPct-Vr7q7AU0YGe-F*l&new1 http://blog.scoutap…

Jsp+Servlet+MYSQL注册登录案例(界面难看,ε=(´ο`*)))唉)

注册登录界面尤为常见&#xff0c;我的界面尤为难看&#xff0c;勉为其难的写吧&#xff0c;前端不熟就是这样。。。 这个案例运用到了: 1.Jsp动态页面--->动态页面 2.Servlet逻辑判断后台---->实现界面与数据库/业务的连接&#xff0c;简而言之&#xff0c;起承转合。PS…

ES6-15 map与set

Promise、Proxy、Map、Set这些ES6新增的api无法用babel实现语法降级&#xff0c;需要使用到polyfill Set 成员是唯一的&#xff0c;不能重复有iterator接口&#xff0c;可迭代具有iterator接口的所有类型&#xff0c;都能作为new Set()的参数&#xff0c;如类数组、数组 con…

ES6-16 WeakMap与WeakSet、proxy与reflect

WeakMap/WeakSet 原型上不存在遍历方法(没有部署iterator接口)成员只能是对象垃圾回收机制不考虑对成员对象的应用 WeakSet/WeakMap 中的对象都是弱引用&#xff0c;即垃圾回收机制不考虑 WeakSet 对该对象的引用&#xff0c;也就是说&#xff0c;如果其他对象都不再引用该对象…

ES6-17 class与对象

class 模拟类的方式语法糖&#xff08;把以前的写法换了一个方式&#xff09; 类内部的方法是不可枚举的 ES5用Object.assign拓展的原型属性是可枚举的 function Point(x, y) {this.x x;this.y y; } // 这样定义的原型上方法eat\drink是可枚举的 Point.prototype Object…

算法 --- 二叉树的最大深度

思路: 1.二叉树的深度,等于Max(左子树最大深度,右子树最大深度) 1 2.节点不存在时,此时的深度为0 3.当节点存在,左右子树不存在时(此时为叶子节点) 返回1 /*** Definition for a binary tree node.* function TreeNode(val) {* this.val val;* this.left this.righ…

ES6-18/19 异步的开端-promise

ES6-18异步的开端-promise ES6-19 promise的使用方法和自定义promisify try catch只能捕获同步异常&#xff0c;不能捕获异步的 等待所有异步都执行完&#xff0c;打印结果&#xff0c;比较笨拙的方法&#xff0c;在每个异步操作加arr.length 3 && show(arr) Promis…

算法 --- 平衡二叉树

解题思路: 1.首先写一个返回深度的函数d 2.写一个遍历函数t 3.在t中首先判断,r是否为空(为空则此时就是平衡二叉树,返回true),然后判断是否为叶子节点(r.left null && r.right null)若是则返回true,最后判断,其左子树的深度与右子树的深度之差是否大于1.若是则返回fal…

【co】ES6-20/21 iterator与generator

ES6-20 iterator与generator ES6-21 async与await、ES6的模块化 try catch不能捕获异步异常 try catch是同步代码 try {setTimeout(() > {console.log(a)}) } catch (e) {console.log(e) }iterator 内部迭代器&#xff1a;系统定义好的迭代器接口&#xff08;如数组Symbol…

驱动芯片

一 LED驱动芯片&#xff1a; 1.1 TM1640:16位数码管驱动芯片&#xff0c;2线制控制&#xff08;CLK/DIN&#xff09;,SCLK低电平时DIN输入&#xff0c;而SCLK高电平时保持DIN保持不变&#xff1b;开始传输&#xff1a;SCLKH时DIN由高变低&#xff0c;停止传输SCLKH时DIN由由低变…

confusion_matrix(混淆矩阵)

作者&#xff1a;十岁的小男孩 凡心所向&#xff0c;素履可往 目录 监督学习—混淆矩阵 是什么&#xff1f;有什么用&#xff1f;怎么用&#xff1f; 非监督学习—匹配矩阵 混淆矩阵 矩阵每一列代表预测值&#xff0c;每一行代表的是实际的类别。这个名字来源于它可以非常容…