JavaScript字符串、数组和对象一些方法使用

电玩女神 2024-04-17 05:28 86阅读 0赞

**1.delete方法**

//数组
    var a = [1,2,3,4,5,6]
    delete a[1]
    
    a
    [1,empty,2,3,4,5,6]
    
    //对象
    var b = {1:'1',2:'2',3:'3'}
    delete b[1]
    
    b
    {2:'2',3:'3'}

**2.字符串的length和索引（通过key）以及for of循环**

str = '01234'
    
    str.length => 5
    str[1]	=>1
    
    for(i of str){
    	console.log(i)
    }
    0
    1
    2
    3
    4

**3.+号特性（把字符串变数组）**

+'1'	//1
    
    但是
    1+'1'		//11

**4.字符串拼接**

var a = 'a';
    var b = 'b';
    
    var c = `${a}+${b}`
    
    c
    'a+b'

**5.对象转字符串和对象通过Object.key转换成数组从而求出对象length**

function toString(items){
      
      	let objString = `${items[0]}`
      
      	//因为对象没法使用.length，所以先转成数组，再求出对象长度
      	var arr = Object.keys(items)
    
      	for(let i=1;i<arr.length;i++){
        	objString = `${objString},${items[i]}`
      	}
      
      	console.log(objString)
    }
    
    toString({0:'0',1:'1',2:'2',3:'3'})		//1，2，3，4

**6.数组反转（reverse()）**

字符串没有reverse()方法，所以字符串需要先变成数组再进行反转。

str = 'aba'
    
    str.split('').reverse().join('')	//'aba'

**7.split()和join()**

''对split来说是全部分开，包括空格，对join来说是全部聚一起，中间没有空格，因为split时有空格，所以聚一起有间隔。  
’ '对split来说有空格的两个之间分开，对于join来说聚在一起，中间有空格，如果split适合有空格，那就空格加空格。

不论是’'还是‘ ’，split和join都是相反的过程

看代码：

let a = "step on no pets"
    
    a.split(' ')
    ["step", "on", "no", "pets"]
    a.split('')
    ["s", "t", "e", "p", " ", "o", "n", " ", "n", "o", " ", "p", "e", "t", "s"]
    
    a.split(' ').join(' ')
    "step on no pets"
    a.split(' ').join('')
    "steponnopets"
    
    a.split('').join('')
    "step on no pets"
    a.split('').join(' ')
    "s t e p   o n   n o   p e t s"

**8.判断一个值是否在数组内**

indexOf方法，如果不在会返回-1，如果在会返回对应的index。

**9.字符串、数组、字典、对象都有索引，集合Set没有索引（ES6中的集合Set）**

//对象索引
    var a = {a:'0',b:'1',c:'2',d:'3'}
    a["a"]
    "0"
    
    //字符串索引
    var str = '12345678'
    str["1"]
    "2"
    str[1]
    "2"

**10.JavaScript in 对 对象 字符串起作用吗？**

目前看对对象和数组起作用，字符串不行

//对象in只能判断key在不在对象内
    var a = {a:'0',b:'1',c:'2',d:'3'}
    'a' in a	//true
    '0' in 	//false
    
    //数组
    var arr = [1,2,3,4,5,6,7,8,9]
    3 in arr		//true
    
    //字符串
    var str = '12345678'
    '2' in str		//报错

**11.Map和Set的遍历**

Array可以采用下标进行循环遍历，Map和Set就无法使用下标。为了统一集合类型，ES6标准引入了iterable类型，Array、Map、Set都属于iterable类型。

具有iterable类型的集合可以通过新的for … of循环来遍历。

更好的遍历：forEach

forEach是iterable内置的方法，它接收一个函数，每次迭代就自动回调该函数。

var a = ['A', 'B', 'C'];
    a.forEach(function (element, index, array) {
        // element: 指向当前元素的值
        // index: 指向当前索引
        // array: 指向Array对象本身
        alert(element);
    });

Set与Array类似，但Set没有索引，因此回调函数的前两个参数都是元素本身：

var s = new Set(['A', 'B', 'C']);
    s.forEach(function (element, sameElement, set) {
        alert(element);
    });

Map的回调函数参数依次为value、key和map本身：

var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);
    m.forEach(function (value, key, map) {
        alert(value);
    });

**12.数组和字符串的indexOf()方法**

var a = 'leetcode'
    a.indexOf('c')
    4
    
    var b=[1,2,3,4,5,6,7,8,9]
    b.indexOf(2)
    1

**13.slice()和splice()区别**

slice()

slice(start,end)：方法可从已有数组中返回选定的元素，返回一个新数组，包含从start到end（不包含该元素）的数组元素。

注意：该方法不会改变原数组，而是返回一个子数组，如果想删除数组中的一段元素，应该使用Array.splice()方法。

var arr = [1,2,3,4,5];
    console.log(arr.slice(1));//[2,3,4,5]  选择序列号从1到最后的所有元素组成的新数组。
    console.log(arr.slice(1,3))//[2,3]  不包含end，序列号为3的元素

同时slice(start,end)可以作用于字符串的切割

/*字符串切割和提取----slice(start,end),substring(),substr()*/
    var str = "Hello,world!";
    var sliceStr = str.slice(1,5);//ello (不包含end)
    var subStr = str.substring(1,5);//ello
    var subStr = str.substr(1,5);//ello,
    var str = "1000000";
    var sliceStr = str.slice(-3);//000  从序列号为-3的位置到最后

splice()

splice()：该方法向或者从数组中添加或者删除项目，返回被删除的项目。（该方法会改变原数组）

var arr = [1,2,3,4,5];
    console.log(arr.splice(2,1,"hello"));//[3]  返回的新数组
    console.log(arr);//[1, 2, "hello", 4, 5]  改变了原数组

参考文章：https://blog.csdn.net/xiaoqingpang/article/details/79108005

**14.获取对象属性的索引**

比如一个对象；

var opt = {
      set1:"1",
      set2:"2",
      set3:"2"
    }

想读取到对象的key，直接读到key无法用原生JS实现，比较常规的做法是用for…in循环：

var opts = { set1: "1", set2: "2", set3: "3" },
        keys = [];
    
    for (key in opts) {
        keys.push(key);
    }
    
    keys[0];    // "set1"
    keys[1];    // "set2"
    keys[2];    // "set3"

但是这里面有坑，因为很多时候你不知道 key 是目标对象自己的，还是通过原型继承来的，所以一般都要做一层判断，只要目标对象自己的：

for (key in opts) {
        if (opts.hasOwnProperty(key) {
            keys.push(key);
        }
    }

好消息是 ES5 增加了 Object.keys 方法，直接获取对象自己的所有键，返回数组：

var keys = Object.keys(opts);

参考文章：https://segmentfault.com/q/1010000000469908

参考文章：  
https://www.cnblogs.com/huchong/p/8108360.html  
https://www.cnblogs.com/justbecoder/p/11383570.html  
https://blog.csdn.net/wangqing84411433/article/details/79567914  
https://cnodejs.org/topic/56c20198c3f170d262995662  
https://www.cnblogs.com/williamjie/p/9765815.html  
Set更多操作：https://m.imooc.com/mip/article/267289