javascript字符串、数组操作（个人字典）

发表于 | 分类于 | 阅读次数:

前言

做题的时候（尽管是水题），很多都跟字符串和数组的操作有关系，但是经常忘记。。经常都要查API才能写。。把几个重要的记下来，没事翻翻。。

字符串

String 对象属性

length属性

length算是字符串中非常常用的一个属性了，它的功能是获取字符串的长度。当然需要注意的是js中的中文每个汉字也只代表一个字符，这里可能跟其他语言有些不一样。

prototype属性

prototype在面向对象编程中会经常用到，用来给对象添加属性或方法，并且添加的方法或属性在所有的实例上共享。因此也常用来扩展js内置对象。

String 对象方法

split()方法

1
stringObject.split(separator,howmany)

split()方法用于把一个字符串分割成字符串数组。第一个参数separator表示分割位置(参考符)，第二个参数howmany表示返回数组的允许最大长度(一般情况下不设置)。

1
2
3
4
var str = 'a|b|c|d|e';
console.log(str.split('|'));    //返回["a", "b", "c", "d", "e"]
console.log(str.split('|', 3));    //返回["a", "b", "c"]
console.log(str.split(''));    //返回["a", "|", "b", "|", "c", "|", "d", "|", "e"]

substring() 方法

substring() 方法返回一个字符串在开始索引到结束索引之间的一个子集, 或从开始索引直到字符串的末尾的一个子集。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
var anyString = "Mozilla";
// 输出 "Moz"
console.log(anyString.substring(0,3));
console.log(anyString.substring(3,0));
console.log(anyString.substring(3,-3));
console.log(anyString.substring(3,NaN));
console.log(anyString.substring(-2,3));
console.log(anyString.substring(NaN,3));
// 输出 "lla"
console.log(anyString.substring(4,7));
console.log(anyString.substring(7,4));
// 输出 ""
console.log(anyString.substring(4,4));
// 输出 "Mozill"
console.log(anyString.substring(0,6));
// 输出 "Mozilla"
console.log(anyString.substring(0,7));
console.log(anyString.substring(0,10));

indexOf()方法

可用于查找字符串中是否有某字串，并返回字串下标。

1
"hello".indexOf('ll');		//2

进制转化

十进制转化为其他进制（Object.toString()）

按10进制去处理字符串，碰到非数字字符，会将后面的全部无视 ： parseInt(num,10); 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
//10进制转为16进制  
(10).toString(16) // =>"a"  
//8进制转为16进制  
(012).toString(16) // =>"a"  
//16进制转为10进制  
(0x16).toString(10) // =>"22"  
//16进制转为8进制  
(0x16).toString(8) // =>"26"  
//10进制转为2进制 //=>  
(1111).toString(2) // => "10001010111"  
//8进制转为2进制 //=>  
(01111).toString(2) //=>"1001001001"  
//16进制转为2进制 //=>  
(0x16).toString(2) // => "10110"
其他进制转化为十进制（parseInt（））
1
2
3
4
5
6
7
8
//2进制到10进制；  
parseInt(10,2) //=>2  
//2进制到10进制；  
parseInt(100,2) //=>4  
//16进制到10进制  
parseInt(12, 16) //=>18  
//8进制到10进制  
parseInt(12,8); //=>10

数组

数组对象方法

Array.forEach()方法

1
2
3
4
5
6
// item 当前元素的值
// index 当前元素下标
// array 当前数组，与arr等同 
arr.forEach(function (item, index, array) {
    console.log(item, index);
});

Array.join()方法

1
2
3
4
5
//接收一个参数，作为分隔符，默认是，
arr = [1,2,3,4];
arr.join();		//"1,2,3,4"
arr.join("")	//"1234"
arr.join("-")	//"1-2-3-4"

Array.reverse()方法

1
2
3
4
5
6
arr = [1,2,3,4];
arr.reverse();		//[4, 3, 2, 1]

//字符串反转：
str = 'abc';
str.split('').reverse().join('');	//cba

Array.from()方法

Array.from()方法从一个类似数组或可迭代对象中创建一个新的数组实例。

1
2
3
4
5
6
7
8
9
10
const bar = ["a", "b", "c"];
Array.from(bar);
// ["a", "b", "c"]
Array.from('foo');
// ["f", "o", "o"]

//字符串反转
let str = "string";
let strArray = Array.from(str);
strArray.reverse().join("");

pop()方法

pop()方法从数组中删除最后一个元素，并返回该元素的值。

1
arr.pop();

push()方法

push()方法将一个或多个元素添加到数组的末尾，并返回新数组的长度。

1
2
arr.pop('ele');		//return arr.length
arr.push(ele1,ele2);

js模拟栈（js栈）

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
function Stack() {
  /**
   * 用数组来模拟栈
   */
  var items = [];
  /**
   * 将元素送入栈，放置于数组的最后一位
   */
  this.push = function(element) {
    items.push(element);
  };
  /**
   * 弹出栈顶元素
   */
  this.pop = function() {
    return items.pop();
  };
  /**
   * 查看栈顶元素
   */
  this.peek = function() {
    return items[items.length - 1];
  }
  /**
   * 确定栈是否为空
   * @return {Boolean} 若栈为空则返回true,不为空则返回false
   */
  this.isAmpty = function() {
    return items.length === 0
  };
  /**
   * 清空栈中所有内容
   */
  this.clear = function() {
    items = [];
  };
  /**
   * 返回栈的长度
   * @return {Number} 栈的长度
   */
  this.size = function() {
    return items.length;
  };
  /**
   * 以字符串显示栈中所有内容
   */
  this.print = function() {
    console.log(items.toString());
  };
}

shift方法

shift()方法移除索引为 0 的元素(即第一个元素)，并返回被移除的元素，其他元素的索引值随之减 1。如果 length属性的值为 0 (长度为 0)，则返回 undefined。

unshift()方法

unshift()方法将一个或多个元素添加到数组的开头，并返回新数组的长度。

1
2
3
4
let a = [1, 2, 3];
a.unshift(4, 5);
console.log(a);
// [4, 5, 1, 2, 3]

slice()方法

slice()方法返回一个从开始到结束（不包括结束）选择的数组的一部分浅拷贝到一个新数组对象。且原始数组不会被修改。

1
2
3
4
5
6
7
var animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];
console.log(animals.slice(2));
// expected output: Array ["camel", "duck", "elephant"]
console.log(animals.slice(2, 4));
// expected output: Array ["camel", "duck"]
console.log(animals.slice(1, 5));
// expected output: Array ["bison", "camel", "duck", "elephant"]

splice()方法

splice()方法通过删除现有元素和/或添加新元素来更改一个数组的内容。

使用splice来添加元素，实质上返回的是[]，

1
2
3
4
var months = ['Jan', 'March', 'April', 'June'];
var delete = months.splice(1, 0, 'Feb');
//delete = []
//months = ['Jan', 'Feb', 'March', 'April', 'June']
1
2
3
4
5
6
7
8
9
var months = ['Jan', 'March', 'April', 'June'];
months.splice(1, 0, 'Feb');
// inserts at 1st index position splice(index,0,item)
console.log(months);
// expected output: Array ['Jan', 'Feb', 'March', 'April', 'June']
months.splice(4, 1, 'May');
// replaces 1 element at 4th index
console.log(months);
// expected output: Array ['Jan', 'Feb', 'March', 'April', 'May']

concat()方法

数据拼接、数组拷贝。

1
2
3
4
5
//拷贝
var newArray = [].concat(oldArr);

//拼接
arr1.concat(arr2);

filter()方法

利用指定的函数确定是否在返回的数组中包含某一项。

1
2
3
4
5
6
7
//计算数组arr中有多少个item
function count(arr, item) {
    var count = arr.filter(function(a){
        return a === item;
    })
    return count.length;
}

DOM操作

创建：

​ createDocumentFragment() //创建一个DOM片段

​ createElement() //创建一个具体的元素

​ createTextNode() //创建一个文本节点

添加：

​ appendChild()

移出：

​ removeChild()

替换：

​ replaceChild()

插入：

​ insertBefore()

复制：

​ cloneNode(true)

查找：

​ getElementsByTagName() //通过标签名称

​ getElementsByClassName() //通过标签名称

​ getElementsByName() //通过元素的Name属性的值

​ getElementById() //通过元素Id，唯一性