IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> ES6——ES6中对象、字符串、数组的扩展方法 -> 正文阅读

[JavaScript知识库]ES6——ES6中对象、字符串、数组的扩展方法

文章目录


一、对象扩展方法

举例: 新建一个名为? person? 的对象

const person = {

? ? ? ? ? ? name: 'Tom',

? ? ? ? ? ? age: 20,

? ? ? ? ? ? height: 180

? ? ? ? }

1. Object.keys?——数组的形式获取除去Symbol 类型的键(也就是属性名)

获得所有的键:console.log(Object.keys(person));?

运行结果:?['name', 'age', 'height']

2.? Object.values——数组的形式获取对象中的值

console.log(Object.values(person));

运行结果:??['Tom', 20, 180]

3.?Object.entries( ) ——把对象创建成map 数据格式

console.log(Object.entries(person));

运行结果:?

[Array(2), Array(2), Array(2)]

0: (2)?['name',?'Tom']

1: (2)?['age',?20]

2: (2)?['height',?180]

4.?Object.getOwnPropertyDescriptors(对象名) ——?复数形式可以获取当前对象所有属性的相关描述

Object.getOwnPropertyDescriptor(对象名,’属性名’)——单数形式需要指定对象的具体属性名

console.log(Object.getOwnPropertyDescriptors(person);

运行结果:??

{name: {…}, age: {…}, height: {…}}

age: {value:?20,?writable:?true,?enumerable:?true,?configurable:?true}

height: {value:?180,?writable:?true,?enumerable:?true,?configurable:?true}

name: {value:?'Tom',?writable:?true,?enumerable:?true,?configurable:?tru

5. Object.create( )——第一个参数是放在新对象的原型上的,第二个参数是放在新对象的实例上。

const obj = Object.create(null,{

??? name:{

?????? ?value:'课工场',

?? ?????//属性特性

??????? writable:true,

??????? configurable:true, 表示能否通过 delete 删除属性、能否修改属性的特性

??????? enumerable:true,

??? }

})

6.?Object.fromEntries( iterable )——JavaScript中的Object.fromEntries()方法是标准的内置对象,用于将键值对列表转换为对象。此方法返回一个新对象,其属性由iterable的条目确定。

参数:此方法接受单个参数iterable,该参数包含可迭代对象,例如Array或Map或其他实现可迭代协议的对象(把二维数组转成对象);

举例1:数组转为对象

const arr = [['name','张三'],['age',18]];

const obj_arr = Object.fromEntries(arr);

console.log(obj_arr);//{name: "张三", age: 18}

举例2:把map转为对象

const mymap = new Map([['name','张三']]);

mymap.set("age",18);

const map_obj = Object.fromEntries(mymap);

console.log(map_obj);

二、字符串扩展方法

1. 去除空格? trim? ?trimStart? ?trimEnd

let str = ' ?asd ?';

console.log(str.trim( ) )? ? ? ? //asd? ? trim? ? ? ?——清空前后空格

console.log(str.trimStart()) //asd? ? ?trimStart——清空头空格

console.log(str.trimEnd()) // asd? ? ?trimEnd ——清空尾空格

三、数组扩展方法

1.??flat

作用:会按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回

返回值:一个包含将数组与子数组中所有元素的新数组,flat会移除数组的空项。

是否改变原有数组:否

举例:

//二维数组变为一维

? const arr1 = [1, 2, 3, 4, 5, 6, [7, 8, 9]]

?? console.log(arr1.flat())

? const arr2 = [1, 2, 3, [4, 5, 6, [7, 8, 9]]] //参数为深度,是一个数字

?? console.log(arr2.flat())//三维变二维

??????? console.log(arr2.flat(2)) //[1,2,3,4,5,6,7,8,9]三维变一维 深度为2

2.???flatMap

作用:首先使用映射函数映射每个元素,然后将结果压缩成一个新数组

返回值:一个新的数组,其中每个元素都是回调函数的结果,并且结构深度 depth值为1

是否改变原有数组:否?

举例:

?const arr2 = [1, 2, 3, 4]

??????? ??????? const result2 = arr2.map(item => item * 10);

??????? ??????? console.log(result2);

??????? ?

??????? ??? //给item加上[]变为二维 可以用flatmap变为一维

??????? ??? const arr3 = [1, 2, 3, 4]

??????? ??????? const result3 = arr3.flatMap(item => [item * 10]);

??????? ??????? console.log(result3);

??????? ???? //如果map的结果是一个多维数组可以进行flat 是两个操作的结合

??????? ??? const arr4 = [1, 2, 3, 4]

??????? ??????? const result4 = arr4.flatMap(item => [item * 10]);


总结

就此停笔,最后,依旧诚挚祝福屏幕前的你健康幸福、平安喜乐。

  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2022-09-15 01:54:56  更:2022-09-15 01:57:39 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/23 10:56:15-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码