数组、字符串及对象-常用方法
目录
1.数组方法
1.增删改： unshift、push、splice、shift、pop、splice、slice
1.unshift：在数组的头部添加内容
2.push：在数组的尾部添加内容
3.splice 在数组的中部添加、删除内容
4.设置数组的长度
5. shift 删除数组的头部元素
6. pop：尾部删除元素
7.splice：增加、删除、修改
8.slice:截取数组的元素 ；
2.回调函数类： map、filter、reduce、find、findIndex 、some、every、sort
1.map:映射
2.filter:过滤
3.reduce:累计
4.find finIndex -查找
5.some every -检测
6.sort:排序
3.其他方法：join、split、reverse、concat、includes [ indexOf ] 、
1.join:拼接符
2.split:拆分符
3.reverse:翻转
4.concat:拼接
5.includes:判断
2.字符串常用方法
1.split、substr、substring、slice、toUpperCase、toLowerCase、 replace、indexOf（待续...）
3.对象新增方法
1.is、assign、Object.hasOwn、hasOwnProperty、keys、values、seal
1.is:判断对象是否相同
2.assign：合并2个或者多个对象
3.1 hasOwnProperty：ES5判断某个属性是否 是对象的自身属性
3.2.Object.hasOwn：ES6判断某个属性是否 是对象的自身属性
4.Object.keys(); 获取对象的所有键名
5.Object.values(); 获取对象的所有键值
6.Object.seal();可以把对象 变成不可配置对象；
1.数组方法
1.增删改： unshift、push、splice、shift、pop、splice、slice
1.unshift：在数组的头部添加内容
// 数组.unshift("添加的值"); var arr = ['a','b']arr.unshift('c');console.log(arr); //['c', 'a', 'b']arr.unshift('d');console.log(arr); //['d', 'c', 'a', 'b']2.push：在数组的尾部添加内容
// arr.push("值"); 会在改变原本的数组var arr = ['a','b']arr.push('c');arr.push('d');console.log(arr); //['a', 'b', 'c','d']3.splice 在数组的中部添加、删除内容
//3.数组的中间添加/删除元素//数组.splice(添加或者删除的索引,删除的个数/添加就是0,要添加的值/删除可以不写)//删除var arr = ['a','b']arr.splice(0,1)console.log(arr); //['b']//添加arr.splice(0,0,'c');console.log(arr); ['c', 'b']4.设置数组的长度
// 直接设置数组的长度 ；(了解)var arr = [1,2,3,4,5];arr.length = 3; // 人为设置 数组长度；console.log(arr); // [1, 2, 3]5. shift 删除数组的头部元素
// 数组.shift() 删除一个元素var arr = [1,2,3]var res = arr.shift();console.log(arr); // [2, 3]// 返还值是删除的值；console.log(res); //16. pop：尾部删除元素
//数组.pop()var arr = [1,2,3]var res = arr.pop();console.log(arr);// [1, 2]console.log(res);//37.splice：增加、删除、修改
增加
// 增加：ary.splice(n,0,m)从索引n开始删除0项把m或者更多的内容插入到索引n的前面let arr = [1,2,3,4];arr.splice(2,0,'a','b')console.log(arr);//[1, 2, 'a', 'b', 3, 4]删除
// 数组.splice(删除开始的索引,删除的个数)// 返还值是删除的元素var arr = [1,2,3,4,5,6];var res = arr.splice(1,1);console.log(res); //[2]console.log(arr); //[1, 3, 4, 5, 6]修改
// 修改：arr.splice(n,x,m)//从索引n开始删除x个，m替换删除的部分把原有内容删除掉，然后用新内容替换掉let arr = [1,2,3,4,5];arr.splice(1,2,'x', 'y')console.log(arr);// [1, 'x', 'y', 4, 5]8.slice:截取数组的元素 ；
不会改变原本数组，只能获取返还值；
//splice(索引开始,个数) var arr = ["a","b","c","d","e"];//0 1 2 3 4var res = arr.slice(1,2);console.log(res); //['b', 'c']2.回调函数类： map、filter、reduce、find、findIndex 、some、every、sort
1.map:映射
map是数组高阶函数，它可以遍历数组，然后经过处理进行返回,可以返回新数组，有返回值
//map(item数组每一项本身,index，代表数组下标,arr，代表这整个数组)//第一个形参是必须写的，第二个第三个可以选填let arr = [1, 2, 3, 4]let newArr = arr.map(item => {return item * 2})let newArr1 = arr.map(item => item * 2)console.log(newArr1) //(4) [2, 4, 6, 8]let newArr2 = arr.map(item => {return { age: item }})console.log(newArr2) //(4) [{…}, {…}, {…}, {…}]//0: {age: 1}//1: {age: 2}//3: {age: 3}//4: {age: 4}2.filter:过滤
将满足条件【return true】的保留，生成一个新的数组
// filter 过滤/*** 将满足条件【return true】的保留，生成一个新的数组*/let arr = [1, 2, 3, 4, 5, 6];let newArr = arr.filter(item => item % 2 === 0)console.log(newArr) //(3) [2, 4, 6]let arr2 = [{id: 1,name: '阿徐',money: 2000},{id: 2,name: '阿兴',money: 3000},{id: 3,name: '阿天',money: 1000},{id: 4,name: '阿黄',money: 1000},{id: 5,name: '阿汪',money: 8000}]let newArr2 = arr2.filter(item => item.money >= 5000)console.log(newArr2) //0: {id: 5, name: '阿汪', money: 8000}let arr3 = [1, 2, 4, -4, undefined, null]// 按布尔值过滤let newArr3 = arr3.filter(Boolean)console.log(newArr3) //(4) [1, 2, 4, -4]3.reduce:累计
reduce()方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。
/*** reduce : 一般用来实现 累计* reduce((上一次的值,当前值,索引)=>{},起始值)*/let arr = [1, 2, 3, 4, 5]let total = arr.reduce((pre, cur, index) => {// pre cur return // 0 1 1// 1 2 3// 3 3 6// 6 4 10// 10 5 15console.log('pre', pre);console.log('cur', cur)console.log('index', index)return pre + cur}, 0)console.log(total) //15let t = arr.reduce((pre, cur) => pre + cur, 0)let todos = [{id: 1,title: '吃饭',isDone: true},{id: 2,title: '睡觉',isDone: true},{id: 3,title: '打代码',isDone: false}]// 已完成工作的数量let doneNum = todos.reduce((pre, cur) => pre + cur.isDone, 0)console.log(doneNum) //24.find finIndex -查找
4.1 find()方法用于查找数组中符合条件的第一个元素，如果没有符合条件的元素，则返回undefined
4.2 findIndex()方法常用来查找数组中满足条件的第一项元素的下标找到符合条件的一项，返回其下标,找不到 -1
注意：findIndex会给数组中的每一项执行一个函数来判断是否满足表达式，如果满足条件后，剩下的元素则不再执行
// find 找到符合条件的一项 // findIndex 找到符合条件的一项，返回其下标// 找到是索引// 找不到 -1let todos = [{id: 1,title: '吃饭',isDone: true},{id: 2,title: '睡觉',isDone: true},{id: 3,title: '打代码',isDone: false}]let todo = todos.find(item => item.id === 1)// 找到符合条件的一项 console.log(todo) //{id: 1, title: '吃饭', isDone: true}let index = todos.findIndex(item => item.id === 10)//找不到为-1console.log(index) //-1let index2 = todos.indexOf({id: 3,title: '打代码',isDone: false})//找不到为-1console.log(index2) //-15.some every -检测
5.1 some:检测数组中是否存在符合指定条件的元素，存在就返回true，不存在就返回false
5.2 every:用于检测数组中某一个值是否都大于或小于或为true或为false。
// 返回一个boolean// some : 有一个满足即可 // every: 每一个都要满足let arr = [1, 2, 3, 4]let res = arr.some(item => item > 30) // 只要有 > 3 的即为真console.log(res) //falselet res2 = arr.every(item => item > 0)console.log(res2) //true6.sort:排序
方法用于对数组的元素进行排序，并返回数组。默认排序
顺序是根据字符串UniCode码。因为排序是按照字符串UniCode码的顺序进行排序的，所以首先应该把数组元素都转化成字符串（如有必要），以便进行比较。
// sort : sort改变原来的数组，还会返回得到一个新数组,新数组就是原来的数组let arr = [1, 23, 45, 3, 4]let newArr = arr.sort(function (a, b) {// return a - b; 升序return b - a;})console.log(newArr, arr, newArr === arr)//(5) [45, 23, 4, 3, 1] (5) [45, 23, 4, 3, 1] truelet names = [{id: 1,name: '阿徐',hot: 2000},{id: 2,name: '阿兴',hot: 4000},{id: 3,name: '阿天',hot: 3000}, {id: 4,name: '阿旺',hot: 22000}]names.sort(function (a, b) {return a.hot - b.hot})console.log(names)//0: {id: 1, name: '阿徐', hot: 2000}//1: {id: 3, name: '阿天', hot: 3000}//2: {id: 2, name: '阿兴', hot: 4000}//3: {id: 4, name: '阿旺', hot: 22000}3.其他方法：join、split、reverse、concat、includes [ indexOf ] 、
1.join:拼接符
将数组以拼接符拼接成一个新的字符串
// join(拼接符) 将数组以拼接符拼接成一个新的字符串let arr = ['a','b','c','d','e']let str = arr.join('')console.log(str) //abcde2.split:拆分符
将字符串以拆分符，拆分为一个新的数组
// split(拆分符) 将字符串以拆分符，拆分为一个新的数组let arr = '12345'let newArr = arr.split('')console.log(newArr) //(5) ['1', '2', '3', '4', '5']let arr1 = '1-2-3-4-5'let newArr1 = arr1.split('-')console.log(newArr1) //(5) ['1', '2', '3', '4', '5']3.reverse:翻转
方法用于颠倒数组中元素的顺序。
let str2 = '1-2-3-4-5'let newArr3 = str2.split('-')newArr3.reverse()let newStr = newArr3 console.log(newStr); //['5', '4', '3', '2', '1']let newStr1 = newArr3.join('-')console.log(newStr1) //5-4-3-2-14.concat:拼接
方法用于连接两个或多个数组。
let arr1 = ["a", "b", "c"];let arr2 = ["d", "e", "f"];let arr3 = arr1.concat(arr2);console.log(arr3); //['a', 'b', 'c', 'd', 'e', 'f']5.includes:判断
includes 可以判断一个数组中是否包含某一个元素，并返回true 或者false.与 indexOf相似
// 特殊 includes 返回false、true // indexOf 索引 没找到返回-1let arr = [1, 2, 3, 4]let index = arr.indexOf(11)// if(index !== -1){// }console.log(arr.includes(1111)) //false2.字符串常用方法
1.split、substr、substring、slice、toUpperCase、toLowerCase、 replace、indexOf（待续...）
3.对象新增方法
1.is、assign、Object.hasOwn、hasOwnProperty、keys、values、seal
1.is:判断对象是否相同
// Object.is();let obj1 = {myname:"张三"}// let obj2 = {// myname:"张三"// }let obj2 = obj1;console.log(obj1===obj2); //trueconsole.log( Object.is( obj1,obj1)); //trueconsole.log(NaN===NaN); //falseconsole.log( Object.is(NaN,NaN)); //true2.assign：合并2个或者多个对象
// 相同键名会覆盖 // 是一个浅拷贝let obj1 = {name: "带带"}let obj2 = {age: 20,}let obj3 = {height: "188cm"}let res = Object.assign(obj1, obj2, obj3);console.log(res); //{name: '带带', age: 20, height: '188cm'}obj1.name = "王五"; console.log(res); //{name: '王五', age: 20, height: '188cm'}3.1 hasOwnProperty：ES5判断某个属性是否 是对象的自身属性
3.2.Object.hasOwn：ES6判断某个属性是否 是对象的自身属性
// es6 判断某个属性是否是对象的自身属性// Object.hasOwn(对象,'对象属性')// ES5// obj.hasOwnProperty("对象属性")let obj = {myname: "带带",age: 20}// ES5console.log(obj.hasOwnProperty("key")); //flaseconsole.log(Object.hasOwn(obj, "age")); //true4.Object.keys(); 获取对象的所有键名
// Object.keys();let obj = {myname: "带带",age: 20}let keys = Object.keys(obj);console.log(keys); //['myname', 'age']5.Object.values(); 获取对象的所有键值
// Object.values(); // 获取对象的所有键名键值let obj = {myname: "带带",age: 20}let values = Object.values(obj);console.log(values); // ['带带', 20]6.Object.seal();可以把对象 变成不可配置对象；
// Object.seal();可以把对象 变成不可配置对象(不能添加或删除，可以修改)let obj = {myname: "带带",age: 20}Object.seal(obj);obj.myname = "芳芳";console.log(obj); //{myname: '芳芳', age: 20}//删除delete obj.myname;console.log(obj); //{myname: '芳芳', age: 20}数组、字符串及对象-常用方法相关推荐
- js内置对象常用方法
js内置对象常用方法 JS内置对象: ● String对象:处理所有的字符串操作 ● Math对象:处理所有的数学运算 ● Date对象:处理日期和时间的存储.转化和表达 ● Array对象:提供一个 ...
- php 字符串数组转数组对象_php怎么将数组转成对象？
php将数组转成对象的方法:1.使用数据类型转换,在数组变量前添加"(Object)"来将数组转成对象.2.先使用json_encode()函数将数组转换为json字符串:然后使用 ...
- 字符串、对象、数组操作方法、json方法
1.字符串操作方法 1.charAt * 作用 * 通过索引找字符 * 语法 * 字符串.charAt(index) * 参数 * ...
- 第38天：运算符、字符串对象常用方法
一.运算符 一元操作符 ++, --, +, - +5 -6 逻辑操作符 !, &&, || 基本运算符 +, -, *, /, % 关系操作符 >, & ...
- freemarker 数组转字符串_TypeScript 实战算法系列（一）：实现数组栈与对象栈
本文由图雀社区认证作者 神奇的程序员 写作而成,图雀社区将连载其TypeScript 实战算法系列,点击阅读原文查看作者的掘金链接,感谢作者的优质输出,让我们的技术世界变得更加美好? 前言 栈作为一种 ...
- php数组循环转为对象,php中循环实现(字符串，对象，或者数组)编码相互转换
/** * 循环实现编码互转 * * @param string $param(字符串,对象,或者数组),$currCharset当前编码,$toCharset期望编码 * @return 参数类型 ...
- java js对象转字符串数组_js 转json格式的字符串为对象或数组(前后台)的方法
一.前台 // 转换成对象 var myObject = JSON.parse(_data); alert("对象:"+myObject.msg); // 转换成数组 var my ...
- html中，将字符串对象数组转成对象数组
1.字符串数组如下 [{"id":"1208183791342927872","name":"测试1","va ...
- JS/Jquery遍历JSON对象、JSON数组、JSON数组字符串、JSON对象字符串
JS遍历JSON对象 JSON对象 var jsonObj = {"id": 102,"year": "2019-2020","l ...
最新文章
- my SQL下载安装，环境配置，以及密码忘记的解决，以及navicat for mysql下载，安装，测试连接...
- python识别文字并且提示_python脚本:检测字符串标识符
- 【数据结构第一周】最大子列和问题整理
- c语言程序设计一元二次函数,计算一元二次函数的根，大家看看那里有错了。。。。...
- 七十三、SpringBoot整合Jpa
- location.href
- 更新小红伞antivirus失败：生成更新结构失败。更新库生成错误 556
- macpro的IDEA常用快捷键~持续更新
- 2021新版OPEN易支付免费开源版 亲测可用
- 计算机主机内有的硬件有哪些,电脑主机内有哪些硬件
- SAP CO生产订单的标准成本、计划成本、实际成本和目标成本
- SQL Server Performance 分析
- Smart3D系列教程6之 《案例实战演练3——倾斜数据正射影像及DSM的生产》
- iOS 支付宝好友分享
- Oracle的安装及导入.dmp文件教程
- 怎么用java做全民飞机大战_基于VC++和OpenCV实现的全民飞机大战游戏
- TeamViewer 连接问题
- vs code 不能正确补全结构体成员变量的解决方法
- 【Python游戏】Python基于pygame实现的人机大战的斗兽棋小游戏 | 附源码
- JVM(四)_性能监控与调优
热门文章
- ReviewBoard 的安装和使用（二）—— 邮箱的配置
- module ‘win32com.gen_py.00020813-0000-0000-C000-000000000046x0x1x9‘ has no attribute ‘CLSIDToClassM
- 蚪侠-远程泛目录[泛域名+泛目录+泛内页]-[代码+汉字]干扰-字体繁简切换-蜘蛛欺骗-主动推送_模板版-V25版
- 基于keras的mnist手写体识别程序
- ERP/MIS开发 LLBL Gen多表操作
- 华为更新云空间配置 显示无法连接服务器,更新服务器连接失败
- java dispose事件_求助！！为什么我的dispose（）不起作用
- 对于大数据、人工智能时代，我们应该如何面对？
- backtrader 自定义indicator_BackTrader回测工具（一）
- python获取鼠标选取的内容_Python三维可视化：鼠标选取交互操作