JavaScript对象中数组对象和字符串对象的常用举例和使用

前端面试秘法

提高个人编程能力就是不停的敲代码

这里我推荐一款前端面试神器----->点击跳转

 

目录

数组对象

判断是否为数组

- instanceof 运算符

Array.isArray()

push添加

pop删除

unshift添加

shift删除

数组排序

数组索引

数组连接

数组截取

数组删除

字符串对象

indexOf

lastIndexOf

根据位置返回字符

字符串连接

截取字符串

字符串替换

字符串分割

数据类型总结

简单数据类型

简单类型传参

复杂数据类型

复杂类型传参

---

数组对象

var arr = new Array();

- 如果只传入一个参数，则参数规定了数组的长度

- 如果传入了多个参数，则参数称为数组的元素

- 如果不传参数就是空数组

判断是否为数组

- instanceof 运算符

可以判断一个对象是否是某个构造函数的实例。

var arr  = [1, 23];

var obj  = {};

console.log(arr instanceof Array); // true

console.log(obj instanceof Array); // false

Array.isArray()

用于判断一个对象是否为数组，isArray() 是 HTML5 中提供的方法。

var arr = [1, 23];

var obj = {};

console.log(Array.isArray(arr));   // true

console.log(Array.isArray(obj));   // false

push添加

push(值1,值2.....)末尾添加一个或多个值

var arr = [1, 23];

console.log("返回长度：" + arr.push(5,6,7));

console.log(arr);

pop删除

pop()删除数组最后一个值

console.log("返回值：" + arr.pop());

console.log(arr);

注意：无需删除参数，长度减1，返回被删除的值。

unshift添加

unshift(值1,值2,值3)在数开头添加一个或多个值。

console.log("返回值：" + arr.unshift(5,6,7)); //返回长度

console.log(arr);

shift删除

shift()删除数组第一个值

console.log("返回值：" + arr.shift());

console.log(arr);

注意：无需删除参数，长度减1，返回被删除的值。

数组排序

reverse() 颠倒数组中的顺序，无参数

var arr = [12, 23,3,7,8];

console.log(arr.reverse()); //返回新数组，会改变原来的数组

sort() 对数组进行排序，默认按字符串升序，原数组会改变。

var arr = [9, 1,3,7,8];

console.log(arr.sort()); //返回新数组，会改变原来的数组

console.log(arr);

console.log(arr.sort(function(a,b){

   return a - b; //则为升序

}));

console.log(arr.sort(function(a,b){

   return b-a; //则为降序

}));

默认排序顺序为按字母升序。

注意：

- 当数字是按字母顺序排列时"40"将排在"5"前面。

- 如果传入“function(a,b){ return a-b;}”，则为升序

- 如果传入“function(a,b){ return b-a;}”，则为降序

数组索引

indexOf(item,start)      可返回数组中某个值指定的元素位置。存在就返回，不存在返回-1；

lastIndexOf(item,start)   在数组中某个值指定的元素位最后一个索引，不存在返回-1；

item：代表要查找的元素值。

start：要查找元素的位置，indexof缺省从第一个开始找，lastinfexof从最后一个开始找。

举例：

var arr = [17, 11,3,7,8,3];

console.log(arr.indexOf(3));//2

console.log(arr.indexOf(3,3));//5

console.log(arr.lastIndexOf(3));//5

console.log(arr.lastIndexOf(3,3));//2

数组连接

concat()  连接两个或多个数组 不影响原数组  返回一个新的数组

举例：

  var arr = [1, 2,3];

  var arr2 = [4,5,6];

  var arr3 = [];
  
console.log(arr3 = arr.concat(arr,arr2));//123456

console.log(arr);//123

console.log(arr3);123456

数组截取

slice()   数组截取slice(start,end) 返回被截取项目的新数组，不改变原数组

start：从何处开始截取，如果是负值就从倒数第几个位置开始。

end：规定从何处开始结束选取，如果没有参数就是start到结束，如果为负数，就表示倒数第几个元素结束截取。（不包含最后一个元素）

var arr = [1, 2,3,4,5,6];

var arr3;

console.log(arr3 = arr.slice(0,2));//1,2

数组删除

splice(index, howmany, item1, ....., itemX) 数组删除，返回新数组，影响原数组

Index：从什么位置添加，删除项目。

Howmany：要删除的项目数。

item1...：要添加的项目值。

 var info = ["Banana", "Orange", "Apple", "Mango"];

 info.splice(1,1,"小红","小帅");//Orange被删除

console.log(info);//添加了 "小红","小帅"两个值

字符串对象

基本包装类型就是把简单数据类型包装成为复杂数据类型，这样基本数据类型就有了属性和方法。

var str = 'andy';

console.log(str.length);

按理基本数据类型是没有属性和方法的，js会把简单类型变为复杂类型。执行过程如下：

var temp = new String('andy');

// 2. 赋值给我们声明的字符变量

str = temp;

// 3. 销毁临时变量

temp = null;

字符串的不可变

指的是里面的值不可变，虽然看上去可以改变内容，但其实是地址变了，内存中新开辟了一个内存空间。

当重新给字符串变量赋值的时候，变量之前保存的字符串不会被修改，

依然在内存中重新给字符串赋值，会重新在内存中开辟空间，这个特点就是字符串的不可变。

由于字符串的不可变，在**大量拼接字符串**的时候会有效率问题

indexOf

返回指定内容在在字符串中的位置，如果找不到就返回-1,找到返回索引。

var info = "Banana";

console.log(info.indexOf("a"));//1

lastIndexOf

从后往前面找指定字符串中的位置，指返回第一个。

var info = "Banana";

console.log(info.lastIndexOf("a"));//5

根据位置返回字符

charAt(index)  返回指定位置的字符，index是索引号。

var info = "Banana";

console.log(info.charAt(0));//B

charCodeAt(index)  获得指定位置的字符的ASCII码

var info = "Banana";

console.log(info.charCodeAt(0));//66

str[index]  与charAt   使用等效

var info = "Banana";

console.log(info[0]);//B

字符串连接

concat(str1,str2,str3)  方法用于连接两个或多个字符串。等效于+；

var str1="123",str2="456",str3="789";

console.log(str1.concat(str2));//123456

console.log(str2.concat(str1,str3));//456123789

截取字符串

substr(start,length)  从start位置（索引）如果是负数从倒数第几个开始，length是个数。

var str1="路漫漫其修远兮";

console.log(str1.substr(0,2));//路漫

console.log(str1.substr(-1,1));//兮

slice(strat,end)     从start位置（索引）开始，截取到end位置（索引），end不包括。

var str1="路漫漫其修远兮";

console.log(str1.slice(0,1));//路

console.log(str1.slice(-5,-1));//漫其修远

注意：

start如果是负数表示从尾部截取多少个字符串，slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素（包含最后一个元素）。

end 参数如果为负数，-1 指字符串的最后一个字符的位置，-2 指倒数第二个字符。

substring(start,end)

从start位置开始，截取到end位置，end取不到，基本与slic相同，但是不接受负数

var str1="路漫漫其修远兮";

console.log(str1.substring(0,1));//路

字符串替换

replace() 方法用于在字符串中用一些字符替换另一些字符，返回新字符串。

语法

字符串.replace(被替换的字符串，要替换的字符串);

var str="1,2,3";

console.log(str.replace(",","*")); //'1*2,3'

console.log(str.replace(/,/g,"*"));//正则替换全部的* 1*2*3

总结：

默认找到第一个匹配的值进行替换，正则的方式替换全部。/g替换全部，/t替换一个

字符串分割

split()方法用于切分字符串，它可以将字符串切分为数组，返回的是一个新数组。

语法

字符串.split(“分割字符”);

var str="1,2,3";

console.log(str.split(",")); //返回成数组

数据类型总结

简单数据类型

基本数据类型、值类型：在存储时变量中存储的是值本身，包括string ，number，boolean，undefined，null

简单类型传参：

函数的形参也可以看做是一个变量，当我们把一个值类型变量作为参数传给函数的

形参时，其实是把变量在栈空间里的值复制了一份给形参，那么在方法内部对形参做任何修改，都不会影响到的外部变量。

function fn(a) {

a++;

console.log(a);//11

}

var x = 10;

fn(x);

console.log(x);//10

复杂数据类型

在存储时变量中存储的仅仅是地址（引用），通过 new 关键字创建的对象（系统对象、自定义对象），如 Object、Array、Date等；

复杂类型传参：

函数的形参也可以看做是一个变量，当我们把引用类型变量传给形参时，其实是把变量在栈空间里保存的堆地址复制给了形参，形参和实参其实保存的是同一个堆地址，所以操作的是同一个对象。

function Person(name) {

this.name = name;

}

function f1(x) { // x = p

console.log(x.name); //刘德华  

x.name = "张学友";

console.log(x.name); // 张学友

}

var p = new Person("刘德华");

console.log(p.name);    // 刘德华   

f1(p);

console.log(p.name);    //张学友

结束语：

这里推荐大家可以有效提高个人能力的平台

前端面试神器（不只有前端嗷）----->点击跳转

让我们一起进步，拿到自己想要的offer