目录

一、对象API扩展

1、Object.is()

2、Object.assign()

3、获取原型对象的方法

4、设置原型对象的方法

5、keys、values、entries、fromEntries

二、数组API扩展

1、Array.from()

2、Array.of()

3、Array.prototype.find()

4、Array.prototype.findIndex

5、Array.prototype.includes()

6、Array.prototype.fill()

7、keys、values、entries

8、Array.prototype.flat()

9、Array.prototype.flatMap()

三、字符串API扩展

1、String.prototype.trimStart()和String.prototype.trimEnd()

2、String.prototype.padStart() / String.prototype.padEnd()

3、Function.prototype.toString()

4、String.prototype.replaceAll()

四、数值API扩展

1、Number.isFinite()和Number.isNaN()

2、Number.parseInt()和Number.parseFloat()

3、Number.isInteger()


一、对象API扩展

1、Object.is()

判断两个值是否相等

返回值:true或false

不仅比较值,还比较符号

console.log(Object.is(+1,-1)); //false
console.log(Object.is(+0,-0)); //false
console.log(+0===-0); //true
console.log(NaN===NaN); //false
console.log(Object.is(NaN,NaN)); //true

2、Object.assign()

(1)两个参数时,实现的是对象的复制、拷贝

返回值:返回第一个参数

let obj = {}
let obj1 = {name:"zhangsan",age:19
}let res = Object.assign(obj,obj1)
console.log(res,obj); //{ name: 'zhangsan', age: 19 } { name: 'zhangsan', age: 19 }
console.log(res===obj); //true

Object.assign()方法实现的是半深拷贝,半深拷贝指的是被复制的对象里面有引用数据类型,实现的就是半深拷贝;而深拷贝指的是被复制的对象里是基本数据类型,实现的就是深拷贝。

let obj = {}
let obj1 = {name:"zhangsan",age:19,class:{number:'2022'}
}let res = Object.assign(obj,obj1)
obj.name = 'lisi'
obj.class.number = '12345'
console.log(obj,obj1); //{ name: 'lisi', age: 19, class: { number: '12345' } } { name: 'zhangsan', age: 19, class: { number: '12345' } }

(2)三个参数时,表示合并对象,把后两个对象合并到第一个对象,并返回第一个对象

let obj = {}
let obj1 = {name:"zhangsan",age:10}
let obj2 = {gender:'male'}
let res = Object.assign(obj,obj1,obj2)
console.log(res,obj); //{ name: 'zhangsan', age: 10, gender: 'male' } { name: 'zhangsan', age: 10, gender: 'male' }
console.log(res===obj); //true

3、获取原型对象的方法

(1)obj.__proto__

(2)obj.constructor.prototype

(3)Object.getPrototypeOf(obj)

let obj = {name:"zhangsan"
}
console.log(obj.__proto__); //[Object: null prototype] {}
console.log(obj.constructor.prototype); //[Object: null prototype] {}
console.log(Object.getPrototypeOf(obj)); //[Object: null prototype] {}

4、设置原型对象的方法

Object.setPrototypeOf(obj,obj1) 表示将obj的原型对象设置为obj1

let obj = {}
let obj1 = {name:"lisi"
}
Object.setPrototypeOf(obj,obj1) //将obj的原型对象设置为obj1
console.log(obj.__proto__); //{ name: 'lisi' }
console.log(obj.constructor.prototype); //[Object: null prototype] {}
console.log(Object.getPrototypeOf(obj)); //{ name: 'lisi' }

注意:将obj的原型对象设置为obj1,obj的构造函数的prototype仍然指向obj原来的原型对象。

5、keys、values、entries、fromEntries

keys 返回所有属性名组成的数组

values 返回所有属性值组成的数组

entries 返回键值对组成的数组

fromEntries 将二维数组转换成对象

let obj = {name:"zhangsan",age:10
}
console.log(Object.keys(obj)); //[ 'name', 'age' ]
console.log(Object.values(obj)); //[ 'zhangsan', 10 ]
console.log(Object.entries(obj)); //[ [ 'name', 'zhangsan' ], [ 'age', 10 ] ]
// fromEntries 将二维数组转换成对象
let res = Object.entries(obj)
console.log(Object.fromEntries(res)); //{ name: 'zhangsan', age: 10 }

二、数组API扩展

1、Array.from()

从类数组对象或者可迭代对象中创建一个新的数组实例

console.log(Array.from("hello")); //[ 'h', 'e', 'l', 'l', 'o' ]
function foo(){console.log(arguments); //{ '0': 1, '1': 3, '2': 5, '3': 7 }console.log(Array.from(arguments)); //[ 1, 3, 5, 7 ]
}
foo(1, 3, 5, 7)

2、Array.of()

创建数组实例,参数是数组元素,解决了new Array(10)传递一个整数值,创建的是length为该整数值的数组。

var arr = new Array(10)
var arr1 = Array.of(10)
console.log(arr,arr1); //[ <10 empty items> ] [ 10 ]

3、Array.prototype.find()

查找满足条件数组元素

参数:回调函数(item,index,arr)

返回值:返回第一个符合条件的数组元素或者undefiend(没有符合条件的就返回undefiend)

var arr = [1,2,3,4,5]
let res = arr.find((item,index,arr)=>{return item > 3
})
console.log(res); //4

4、Array.prototype.findIndex

查找满足条件数组元素

参数:回调函数 (item,index,arr)

返回值:返回符合条件得第一个数组元素索引或者-1(没有符合条件的就返回-1)

var arr = [1,2,3,4,5]
let res = arr.findIndex((item,index,arr)=>{return item > 3
})
console.log(res); //3

5、Array.prototype.includes()

查找是否包含某个元素,返回true/false

let arr = [1,2,3,4]
console.log(arr.includes(1)); //true

6、Array.prototype.fill()

用来填充数组

修改原数组

返回修改后的数组

语法:

fill(value)
fill(value, start)
fill(value, start, end)
let arr = [1,2,3,4]
let res = arr.fill(5,2)
console.log(res); //[ 1, 2, 5, 5 ]
console.log(arr); //[ 1, 2, 5, 5 ]

7、keys、values、entries

返回值:返回一个迭代器对象

var arr = [1,2,3,4,5]
console.log(arr.keys()); //Object [Array Iterator] {}
console.log(arr.values()); //Object [Array Iterator] {}
console.log(arr.entries()); //Object [Array Iterator] {}

8、Array.prototype.flat()

用于把数组展平,通过传入层级深度参数(默认为1),来为下层数组提升层级。如果想提升所有层级可以写一个比较大的数字甚至是Infinity,当然不推荐这么做。

var arr = [1,2,3,[4,5,6,[7,8,9]]]
console.log(arr.flat(1)); //[ 1, 2, 3, 4, 5, 6, [ 7, 8, 9 ] ]
console.log(arr.flat(2)); //[ 1, 2, 3, 4, 5, 6, 7, 8, 9 ]
console.log(arr.flat(Infinity)); //[ 1, 2, 3, 4, 5, 6, 7, 8, 9 ]

9、Array.prototype.flatMap()

它是 Array.prototype.map() 和Array.prototype.flat()的组合,通过对map调整后的数据尝试展平操作。

将数组展开,并让数组每一项都乘2

var arr = [1,2,3,[4,5]]
let res = arr.flatMap((item)=>{if(typeof item === 'number'){return item * 2}else{return item.map(item=>{return item * 2})}
})
console.log(res); //[ 2, 4, 6, 8, 10 ]

三、字符串API扩展

1、String.prototype.trimStart()和String.prototype.trimEnd()

String.prototype.trim() 被用于去除头尾上的空格、换行符等,现在通过 trimStart()trimEnd() 来头和尾进行单独控制。trimLeft()trimRight() 是他们的别名。

let str = " hello world "
console.log(str);
console.log(str.trimStart());
console.log(str.trimEnd()+'222');

2、String.prototype.padStart() / String.prototype.padEnd()

这两个函数的作用是在头尾添加字符串,它们接收两个参数 str.padStart(targetLength [, padString]),其中 targetLength 表示填充完的字符串长度,padString 表示填充的字符串,默认填充空格。

let str = 'es8'
console.log(str);
console.log(str.padStart(4));
console.log(str.padStart(6,'abc'));
console.log(str.padStart(5,'abc'));//对abc进行截取
console.log(str.padStart(7,'abc'));//对abc进行重复
console.log(str.padEnd(5,'abc'));
console.log(str.padEnd(7,'abc'));

3、Function.prototype.toString()

Function.prototype.toString()将从头到尾返回源代码中的实际文本片段。这意味着还将返回注释、空格和语法详细信息。

function foo(){// 这是一个注释console.log('我是一个函数');
}
console.log(foo.toString());

4、String.prototype.replaceAll()

提供对字符串的全局替换。

let str = '11112323'
console.log(str.replace('1','x')); //x1112323
console.log(str.replace(/1/g,'x')); //xxxx2323
console.log(str.replaceAll('1','x')); //xxxx2323

四、数值API扩展

1、Number.isFinite()和Number.isNaN()

与isFinite、isNaN不同,这两个新方法只对数值有效,Number.isFinite()对于非数值一律返回false, Number.isNaN()只有对于NaN才返回true,非NaN一律返回false

Number.isFinite(0.8); // true
Number.isFinite(NaN); // false
Number.isFinite(Infinity); // false
Number.isNaN(NaN) // true
Number.isNaN(15) // false

2、Number.parseInt()和Number.parseFloat()

ES6 将全局方法parseInt()parseFloat(),移植到Number对象上面,行为完全保持不变。

Number.parseInt('12.34') // 12
Number.parseFloat('123.45#') // 123.45

3、Number.isInteger()

Number.isInteger()用来判断一个数值是否为整数。

Number.isInteger(25) // true
Number.isInteger(25.1) // false

ES6——对象、数组、字符串、数值新增API相关推荐

  1. ES6变量常量字符串数值

    [转]ES6之变量常量字符串数值 ECMAScript 6 是 JavaScript 语言的最新一代标准,当前标准已于 2015 年 6 月正式发布,故又称 ECMAScript 2015. ES6对 ...

  2. js对象数组赋值或者新增新对象

    给数组里的对象进行赋值,如果不存在就添加新的数据对象 var model = [] //newData是新的对象数组 model = Object.assign({}, model ,newData. ...

  3. es6对象数组按指定指定属性数组排序

    let arr = let a = [ {name:"dema", id:'23-ba'}, {name:"xiya", id:'44-ba'}, {name: ...

  4. html中,将字符串对象数组转成对象数组

    1.字符串数组如下 [{"id":"1208183791342927872","name":"测试1","va ...

  5. ES6对象(1):新增语法与API

    目录 一.新增的对象字面量语法 1.成员速写 2.方法速写 3.计算属性名 二.Object的新增API 1.Object.is 2.Object.assign 3.Object.getOwnProp ...

  6. ES6 --》字符串与数值新增方法

    目录 字符串新增方法 模板字符串 字符串对象新增方法 数值新增方法 Math数值新增方法 主要讲解了ES6中字符串与数值新增的常见的主要方法, 对其做了如下总结: 字符串新增方法 ES6对字符串新增的 ...

  7. 内置对象的API Array数组对象 String字符串对象 json字符串 JSON对象 js作用域及变量预解析 引用类型与值类型区别 共享引用 基本包装类型 数组去重

    01-内置对象的API a.Date对象获取时间 b.Array对象数组加工 c.String对象字符串加工 d.json字符串的语法格式 e.JSON对象的字符串与对象转换应用 02-JS作用域 a ...

  8. ES6函数第三篇:函数篇(新增API与箭头函数)

    1.新增API--new.target 众所周知,js中构造函数需使用new来调用,但是即使不使用new关键字,也可以调用构造函数,如[例1-1],为了解决这一问题,js的解决方式为使用instanc ...

  9. java中常用API、Scanner类、匿名对象、Random类、ArrayList类、对象数组

    java中常用API: API:Application Programming Interface,应用程序编程接口.Java API是JDK中提供给我们使用的类的说明文档.这些类将底层的代码实现封装 ...

最新文章

  1. jQuery对select操作
  2. 【视频】vue组件的全局注册
  3. BusinessSkinForm使用
  4. ASP.NET Core 2.2 : 扒一扒新的Endpoint路由方案
  5. 中国大学生计算机设计大赛云南,第14届中国大学生计算机设计大赛云南赛区决赛举行...
  6. C语言1094题目,P1094 (C语言代码)
  7. 计算机管理员四级,计算机四级基本知识点
  8. 定了!华为P30/P30 Pro正式官宣:3月26日见
  9. 微软最有价值专家大中华峰会开幕视频
  10. 微信App支付全解析
  11. 数据结构以及相关排序
  12. 硬核!地铁大数据客流分析系统
  13. 【颜纠日记】利用PS在原创图片上制作十字水印
  14. 汽车销量查询小助手(小程序)开发心路历程
  15. 《视觉SLAM十四讲》学习笔记:第5讲相机与图像
  16. lisp不是函授型语言_讨论:为什么Lisp语言不再被广泛使用
  17. 7.2_gd-sgd
  18. 情人节,你约,还是不约?
  19. oceanus-58总体框架理解
  20. 定时关机命令——shutdown

热门文章

  1. 程序员的算法课(6)-最长公共子序列(LCS)
  2. PASCAL VOC2012类型的数据集生成train.txt\val.txt等文件
  3. jQuery append( ) 方法
  4. Firefox 扩展插件
  5. MySql delete多表关联删除的使用方法
  6. qt中,如何用QLabel显示一个变量!
  7. 转:中国移动宽带光猫F663路由模式改桥接模式
  8. GTX1650 搭建TensorFlow-GPU 2.4框架(CUDA11.0 + cudnn 8.04 + anaconda 3.8)
  9. webstorm安装及汉化后无法设置的原因总结
  10. 2.24-2.28的fsop