js|js 字符串、数组、对象等梳理
字符串
1，增：
1，怎么创建字符串：
var str = '' //单引号
var str = "" //双引号
var str = '' ;
//返斜冒号，全局匹配
var str= new Str( );
//自变量创建字符串，一般不建议试用
2，改： 1，trim（）；去空格
' abc '.trim( )；//去掉首尾的空格
' abc '.trimLeft( )；//去掉左侧的空格
' abc '.trimRight( ) ；//去掉右侧的空格
2，replace（）；替换字符串
'abc'.replace('a', 'b') // 'bbc'
'aac'.replace(/a/g, 'b') // 'bbc'
3，split（,）字符串分割成数组，获取你想要的值
注：, =>表示是以什么符号给隔开'a,b,c'.split(',') // ['a', 'b', 'c']
'7@@星期四'.split('@@') //[7, 星期四]
4，join（）数组转化成字符串：
注：参数里面标点表示以什么标点分割字符串；没有默认为 ，var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"arr.join()；// George,John,Thomas
arr.join(".")；// George,John,Thomas
5，toString() 可把一个 Number 对象转换为一个字符串，并返回结果。
varnumber=[ 1,12,89,76 ];
number.toString()；// "1,12,89,76"
6，valueOf()：返回某个字符串对象的原始值
var myDate=new Date()
myDate.valueOf()；// 1583316878578
7，concat( )：连接字符串，字符串拼接。
'a'.concat('b')；//‘ab’
8，toUpperCase()：把字符串转换为大写
9，toLowerCase(): 返回一个字符串，该字符串中的字母被转换成小写。
3，查： 1，strObj.charCodeAt(index) ：从字符串中获取单个字符
注：如果指定位置没有字符，将返回NaN。var str = "ABC";
str.charCodeAt(0);
// 65
2，String.fromCharCode([code1[,code2...]]) ：根据数值从Unicode字符串中返回一个字符串。
String.fromCharCode(65,66,112);
// ABp
3，strObj.charAt(index)：返回指定索引位置处的字符。如果超出有效范围的索引值返回空字符串。
注：有效值是0与字符串长度减一之间的值。var str = "ABC";
str.charAt(1);
// B
4，indexOf()；如果要检索的字符串值没有出现，则该方法返回 -1。适合数组使用
var str="Hello world!"
console.log(str.indexOf("Hello") + "
")；// 0
console.log(str.indexOf("World") + "
")；// -1,这里是大小写有区别，检索不出来
5，lastIndexOf方法：返回String对象中字符串最后出现的位置。如果没有匹配到子字符串，则返回-1。
var str = "ABCDECDF";
str.lastIndexOf("CD");
// 5
6，slice（）方法：返回字符串的片段
注：strObj.slice(start[,end])1，如果只有一个参数，则复制的是参数数字所表示的长度，索引从0开始2，start指明子字符串的起始位置，该索引从0开始起算。如果start为负，将它作为length+start处理，此处length为字符串的长度。3，end指明子字符串的结束位置(不包括结束字段索引值)，该索引从0开始起算。如果end为负，将它作为length+end处理，此处length为字符串的长度。var str = "ABCDEF";
str.slice(2,4);
// CD 根据索引值
str.slice（1）;
// A 返回的是位置
7，substring方法：返回位于String对象中指定位置的子字符串。
注：start指明子字符串的起始位置，该索引从0开始起算。end指明子字符串的结束位置(不包括结束字段索引值)，该索引从0开始起算。substring方法使用start和end两者中的较小值作为子字符串的起始点。如果start或end为NaN或者为负数，那么将其替换为0。var str = "ABCDEF";
str.substring(2,4);
// 或 str.substring(4,2);
//=> CD
8，substr（start，length）方法
注：start所需的子字符串的索引值；必填。字符串中的第一个字符的索引为0。length在返回的子字符串中应包括的字符个数；可选。var str = "ABCDEF";
str.substr(2,4);
// CDEF
9，search（）返回与正则表达式查找内容匹配的第一个字符串的位置。如果没有匹配到子字符串，则返回-1。
var str = "ABCDEF";
str.search('CD')// 2
10，str.length; 获取字符串的长度
var str = "ABCDEF";
str.length；// 6
11，includes( )：判断是否包含，适合字符串。
var name = "王汉炎";
//目标字符串
name.includes('炎');
//true；返回的是一个布尔值
12，变量变为布尔值var str ;
// undefined
var blooeam = ! str；// true
5，判断元素是否是字符串 1，typeof 判断元素类型，一般适用与字符串校验，
但是不适用数组与对象，因为数组本质上也是对象varstr = 'adcvgf';
console.log( typeof str == string );
// true
数组
注：数组也是对象1，命名数组： 构造函数
varary = new Array();
// 创建一个空数组
var arr2 = new Array(20);
// 创建一个包含20项的数组
var arr3 = new Array(“lily”,“lucy”,“Tom”);
// 创建一个包含3个字符串的数组
var 创建数组
var arr4 = [];
//创建一个空数组
var arr5 = [20];
// 创建一个包含1项的数组
var arr6 = [“lily”,“lucy”,“Tom”];
// 创建一个包含3个字符串的数组
2，增删： 1，push（）与pop（）
push（）：可以接收任意数量的参数，把它们逐个添加到数组末尾，并返回修改后数组的长度。pop()；用于把数组的最后一个元素从其中删除，并返回最后一个已删除元素的值var ary = ['name','sex','age']
ary.push('hair')
ary // ["name", "sex", "age", "hair"]
var item = ary.pop()；
item // 'hair'
2，shift() 和 unshift()
shift()：删除原数组第一项，并返回删除元素的值；如果数组为空则返回undefined 。
unshift(): 可向数组的开头添加一个或更多元素，并返回新的长度。
var ary = ['name','sex','age']
ary.shift()；// name
ary.unshift('hair')；// 4t
3，Arrary.splice（start， deleteCount， item1 ， item2）；
注：start开始索引值deleteCount要删除的个数，deleteCount=0，那么则为增加item1为增加的新项目,原来数组发生改变// 新增
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 0, "Lemon", "Kiwi");
//2—起始索引值；0—增加；后面的就是新增的元素
fruits；// ["Banana", "Orange", "Lemon", "Kiwi", "Apple", "Mango"]
// 删除
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 2);
//["Apple", "Mango"]
// 2—起始索引值；2—删除个数
补充// 通过id值来找到他的索引值，并利用 splice 进行删除
del(id){
var index = this.list.findIndex(item=>{
if (item.id == id){
return true;
}
})
this.list.splice(index,1)
},
4，扩展方法
var arr = [1,2,3]
[...arr, 4]；//在前面插入
[0, ...arr]；//在后面插入
[...arr.slice(0,2), 插入内容, ...arr.slice(2)]；//从中间插入
3，改
1，arr[index]=新值；
2，reverse() 方法用于颠倒数组中元素的顺序。
var arr = ["George","John","Thomas"];
arr.reverse() ;
// ["Thomas", "John", "George"]
3，concat() 合并数组，不改变原数组；
注：arrayObject.concat(x,y,......,z) 这里的参数必须是一个具体的值，可以是多个// 方法一
var a = [1,2,3];
a.concat(4,5);
// [1,2,3,4,5]// 方法二
var ary3 =[...ary1, ...ary2];
// [1,2,3,4,5,6]// 方法三
for( var i in ary2)
{
ary1.push(ary2[i]);
}
4，sort() 按升序排列数组项——即最小的值位于最前面，最大的值排在最后面
var arr = ["George","John","Thomas","James","Adrew","Martin"];
arr.sort();
//["Adrew","George","James","John","Martin","Thomas"]
自定义设置大小函数排序function sortNumber(a,b){
return b-a
}var arr = [10,5,40,25,1000,1]
arr.sort(sortNumber);
// [1000, 40, 25, 10, 5, 1]5，splice(): 可以实现删除、插入和替换
实现删除//splice(index,要删除的几个数)
var arr = [1,3,5,7,9,11];
var arrRemoved = arr.splice(0,2);
console.log(arr);
//[5, 7, 9, 11]
console.log(arrRemoved);
//[1, 3]
实现添加注：splice()方法始终都会返回一个数组，该数组中包含从原始数组中删除的项，如果没有删除任何项，则返回一个空数组。// 实现插入 splice(index,0,要插入的项数)
// 三个参数：：起始位置、 0（要删除的项数）和要插入的项。
var arr = [5,7,9,11];
var arrRemoved2 = arr.splice(2,0,4,6);
console.log(arr);
// [5, 7, 4, 6, 9, 11]
console.log(arrRemoved2);
// []
【js|js 字符串、数组、对象等梳理】
实现替换注：指定 3 个参数：起始位置、要删除的项数和要插入的任意数量的项。插入的项数不必与删除的项数相等;
var arr = [5,7,9,11];
var arrRemoved3 = arr.splice(1,1,2,4);
console.log(arr);
// [5, 2, 4, 9, 11]
6，forEach()：对数组进行遍历循环，对数组中的每一项运行给定函数。这个方法没有返回值。
注：三个参数：遍历的数组内容；第对应的数组索引，数组本身。var arr = [1, 2, 3, 4, 5];
arr.forEach(function(x, index, a){
console.log(x + ‘|’ + index + ‘|’ + (a === arr));
});
// 输出为：
// 1|0|true
// 2|1|true
// 3|2|true
// 4|3|true
// 5|4|true
7，slice（）方法：返回字符串的片段
注：strObj.slice(start[,end])1，如果只有一个参数，则复制的是参数数字所表示的长度，索引从0开始2，start指明子字符串的起始位置，该索引从0开始起算。如果start为负，将它作为length+start处理，此处length为字符串的长度。3，end指明子字符串的结束位置，该索引从0开始起算。如果end为负，将它作为length+end处理，此处length为字符串的长度。var str = "ABCDEF";
str.slice(2,4);
// CD 根据索引值
str.slice（1）;
// A 返回的是位置
数组迭代方法，详情查看[https://www.jianshu.com/p/57721617e844]
注：补充案例 arr = arr.map((item, index) => {
if(index === 目标下标) {
return {
...item,
修改内容
}
} else {
return item
}
})
8，join() ; 把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。
注：str.join(sequence)；// sequence -- 要连接的元素符号var a = [ 1, 2, 3, 4, 5, 6 ];
a.join("|");
//"1|2|3|4|5|6"
9，toString()：把数组转换为字符串，并返回结果；
var arr = [1,2,3,4,5,6,7,8,9,11];
arr.toString();
// "1,2,3,4,5,6,7,8,9,11"
10，reduce() :方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值
function (total, value, index, arr)
函数参数:
total：必需。初始值, 或者计算结束后的返回值。
value：必需。当前元素
index：可选。当前元素的索引
arr：可选。当前元素所属的数组对象。
var numbers = [65, 44, 12, 4];
function getSum(total, num) {
return total + num;
}
numbers.reduce(getSum);
// 125
11，
!！：把一个数组变成布尔值var arrary =[12,23,54,56,43]
!!arrary;
//true
!arrary;
// false
12，_.isUndefined(value)：检查一个值是否是undefined；返回值是布尔值
_.isUndefined(value)；
4，查
ES6为Array增加了find()，findIndex函数。1，find( value,index,arr )：用来查找目标元素，找到就返回该元素，找不到返回undefined。
注：返回值 => 找到的第一目标元素三个参数:value：每一次迭代查找的数组元素;
index：每一次迭代查找的数组元素索引;
arr：被查找的数组;
const arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
var ret1 = arr1.find((value, index, arr) => {
return value > 4
})
console.log( ret1);
// 5var ret2 = arr1.find((value, index, arr) => {
return value > 14
})
console.log(ret2);
// undefined
2，findIndex()函数也是查找目标元素，找到就返回元素的位置，找不到就返回-1。
注：返回值 => 返回值找到的 index 值，找不到返回 -1三个参数:value：每一次迭代查找的数组元素;
index：每一次迭代查找的数组元素索引;
arr：被查找的数组const arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
var ret3 = arr1.findIndex((value, index, arr) => {
return value > 4
})
console.log(ret3);
// index => 4var ret4 = arr1.findIndex((value, index, arr) => {
return value > 14
})
console.log(ret4);
// index => -1
注：特殊数字 NaN 除外，需要特殊的处理方法3，Array.from(obj, mapFn, thisArg): 从一个类似数组或可迭代对象创建一个新的，浅拷贝的数组实例
三个参数:- obj：想要转换成数组的伪数组对象或可迭代对象;
- mapFn(可选)：如果指定了该参数，新数组中的每个元素会执行该回调函数;
- thisArg(可选)：执行回调函数 mapFn 时 this 对象。
返回值：一个新的数组实例。
var obj = {
name:'xiaosan',
age:73,
selectList:[]
}if (!obj.selectList){ // 进行判断值是否存在
console.log('XXXXX')
}
5，判断元素是否是数组 1，instanceof 判断元素是否是数组
var list = []
console.log(list instanceof Array);
// true
2，constructor 判断元素是否是数组
let arr = [];
console.log(arr.constructor == Array);
//true
3，isArray 判断元素是否是数组
let arr = [];
console.log(Array.isArray(arr));
//true
对象 1，新建对象 1，var 创建一个空对象
var x = { };
2，通过构造函数新建一个空对象
var x = new Object();
* 判断是否是对象的方法 *
xinstanceofObject;
// true
2，增 1，新增一个对象属性
var x = new Object();
x.name ="小屋先生"
x['name'] ="小屋先生"
x // {name：”小屋先生“}
2，for in
var people = {
name: '小五'，
age：20，
likeColor：‘yellow’
}for (var k in bonly) {
if(k=='age'){
delete bonly[k];
}
}
3，删 1，delete（）；删除
varcar = {name:"车子",color:"blue",nub:"1"}
delete car.color;
car;
// {name: "车子", nub: "1"}
4，改 1，assign() ：合并多个对象，将源对象的所有可枚举属性，复制到目标对象（target）
// 合并多个对象
var a={name:'jack'};
var b={age:10};
Object.assign(a,b);
let a = { ...a, ...b }
console.log(a) //{name: "jack", age: 10}
// 合并多个对象，但是想同的属性，那么则会替换
var a={name:'jack', age:20};
var b={age:10};
Object.assign(a,b);
console.log(a) //{name: "jack", age: 10}
2，toString()
var a={name:'jack', age: 10};
a.toString();
// "[object Object]"
5，查 1，Object.keys(obj) : 返回一个包含所有给定对象自身可枚举属性名称的数组
注：obj: 要返回其枚举自身属性的对象；返回结果是给定对象的所有可枚举属性的字符串数组。varcar = {name:"车子",color:"blue",nub:"1"};
Object.keys(car);
// ["name", "color", "nub"]
2，Object.values(obj)：返回给定对象自身可枚举值的数组。
注：obj：被返回可枚举属性值的对象；返回值=>给定对象的所有可枚举属性值的数组varcar = {name:"车子",color:"blue",nub:"1"};
Object.values(car);
// ["车子", "blue", "1"]
3，isArray() ：方法用于判断一个对象是否为数组；返回值是布尔值
Array.isArray(fruits);
// 判断一个对象是否是数组
Object.entries() 1，Object.entries()：方法返回一个给定对象自身可枚举属性的键值对数组
- 示例1 -- 字符串
const str = '123';
console.log(Object.entries(str));
// [['0', '1'], ['1', '2'], ['2', '3']]
- 示例2 -- 数组
const arr = [1, 2, 3];
console.log(Object.entries(arr));
// [['0', 1], ['1', '2'], ['2', '3']]
- 示例3 -- 对象
const obj = { foo: 'bar', baz: 'abc' };
console.log(Object.entries(obj));
// [['foo', 'bar'], ['baz', 'abc']]
- 实例 -- 数字、浮点数
const num = 123;
console.log(Object.entries(num));
// []const float1 = 12.3;
console.log(Object.entries(float1));
// []
5，判断元素是否是数组 1，instanceof 判断元素是否是数组
var list = []
console.log(list instanceof Array);
// true
2，constructor 判断元素是否是数组
let arr = [];
console.log(arr.constructor == Array);
//true
3，isArray 判断元素是否是数组
let arr = [];
console.log(Array.isArray(arr));
//true
json 1，JSON.parse()：从一个字符串中解析出json对象，当获取本地存储的json字符串时，要转换为对象
var data='https://www.it610.com/article/{"name":"goatling"}'
JSON.parse(data) // name:"goatling"
2，JSON.stringify()：从一个对象中解析出字符串；一般存储都是以json字符串形式存储
var data=https://www.it610.com/article/{name:'goatling'}
JSON.stringify(data) // '{"name":"goatling"}'
对于对象，方法后期还会继续补充......
推荐阅读
- 一个人的碎碎念
- 野营记-第五章|野营记-第五章 讨伐梦魇兽
- Shell-Bash变量与运算符
- 清明，是追思、是传承、是感恩。
- 牛人进化+|牛人进化+ 按自己的意愿过一生
- 七老修复好敏感、角质层薄、红血丝
- 华为旁！大社区、地铁新盘，佳兆业城市广场五期！
- 标签、语法规范、内联框架、超链接、CSS的编写位置、CSS语法、开发工具、块和内联、常用选择器、后代元素选择器、伪类、伪元素。
- 螃蟹和这些食物同吃，轻则腹泻、重则中毒！要小心哦~
- 八、「料理风云」