JavaScript学习笔记——数组的方法以及部分方法的重构

目录什么是数组数组的新建方式数组和对象中 点方法和中括号的区别遍历数组for 和 for in的区别数组的方法arr.push("a","b");arr.unshift("a","b");arr.pop(); //pop中没有参数,arr.shift(); // shift 中没有参数 清空数组 ↓重构pop方法重构unshift方法arr.concat(arr1);arr.join(); // 参数为字符串的连接符重构join...
摘要由CSDN通过智能技术生成

目录

什么是数组

数组的新建方式

数组和对象中 点方法和中括号的区别

 遍历数组

for 和 for in的区别

数组的方法

arr.push("a","b");

arr.unshift("a","b");

arr.pop(); //pop中没有参数,

arr.shift() ; // shift 中没有参数

     清空数组 ↓  

重构pop方法

重构unshift方法

arr.concat(arr1);

arr.join(); // 参数为字符串的连接符

重构join方法

toString也可直接将数组转换为字符串

判断两个数组的内容是否相同

判断两个数组的内容是否相同(存在顺序不同)

_________________________面试题

arr.splice(从什么位置开始,删除多少个元素,要插入的元素);

数组去重

arr.slice(start,end)

arr.indexOf(要查询的元素,从哪开始查询)  

Array.from(类似于数组的列表)  转为数组

使用 indexOf 查询到数组中所有的为3的元素

lastIndexOf(查找得元素,从什么位置开始查找)   从后向前查找

遍历数组(forEach 和 map)

冒泡排序      

arr.sort(); 排序,仅能10以内数字 缺点:按字符排序

arr.sort(function(后一项,前一项){})  仅适用于数值

arr.some(function(item,index,arr){  });

        //  重构 some     桥接模式

arr.every(function(item,index,arr){  })

arr.filter(function(item,index,arr){ return 条件  });

arr.reduce(function(累积值,元素,下标,数组){ },初始值);

重构reduce

Array.isArray()

arguments 参数列表(类数表)

     重构多参数push

arguments.callee & arguments.callee.caller

二维数组


 

 

 

 

什么是数组

可以理解为数据的组合

 

var arr1=["a","b","c","d","e","f"];        // 数据可以是任何类型,顺序排列,可以重复

var arr2=[6,2,4,5,8,0,2,1,3,5,6];      // 把数组中的每个数据叫做元素,简称元,元素间使用逗号分隔

console.log(arr1[0]);      // “a” 数组中的数据按照顺序排列,从0开始,把这个叫做索引,也叫做下标

arr1[0]="z";          // 这里的0是下标,"z" 是元素  ,arr1[0]叫做下标变量 给arr[0]重新赋值 “z”

 

数组和对象一样都是引用数据类型

     

 

数组的新建方式

字面量创建 var arr=[4,5,3,6,2,1];

构造函数创建 var  arr1=new Array(4,5,3,6,2,1);

var arr=new Object([1,2,3,4,5]); //一般不用这种创建数组

数组的本质是对象 继承于对象

 

如果通过数组的构造函数创建数组,参数仅有1个,且这个参数是正整数,则表示新建一个具备该正整数长度的空数组,里面有这个长度的若干空元素,如果是负数或者小数时,报错,如果输入的不是数值,是其他类型时,这个数据就会作为该数组的第0个元素,长度为1 如下

var arr2=new Array(5); // 创建一个长度为5的空数组

var arr2=new Array(3.5); // 报错

var arr2=new Array("a"); // arr2[0]="a"

    

数组长度就是元素的个数

数组的最大下标是数组的长度-1(元素个数-1);

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

console.log(arr.length); // 就是数组的长度,也是元素的个数

arr[arr.length-1]=20; // 把数组中最后一个元素赋值为20

arr[arr.length]=20; // 在数组的最尾部添加一个元素

arr.length=3; // 数组的长度是可以被修改  超出长度的元素会被删掉

arr.length=0; // 清空整个数组

 

 

对象的属性 => 字符型 对象的属性名会隐式转换成字符

数组的索引 => 数值型 数组的下标会隐式转换成数值

不能转换成数值的(NaN)会默认添加为数组中的对象属性名(把数组当作对象添加属性)

数组不能用点语法取元素,但是可以用点语法取属性值

数组的长度仅记录数组中下标的个数,不包括数组中属性的数量

 

______________________________________________________

 

数组和对象中 点方法和中括号的区别

中括号运算符总是能代替点运算符。但点运算符却不一定能全部代替中括号运算符。

中括号运算符可以用字符串变量的内容作为属性名。点运算符不能。

中括号运算符可以用纯数字为属性名。点运算符不能。

中括号运算符可以用js的关键字和保留字作为属性名。点运算符不能。

______________________________________________________

 

 遍历数组

数组的循环是根据下标的数字从0开始循环到最大下标,有序

对象是循环所有属性名,无序 属性遍历是根据对象属性名添加的顺序

 

var arr = [5, 2, 7, , 4, 9, 6];
arr["a"] = 10;
for(var i=0;i<arr.length;i++){
    console.log("索引值"+i+":"+arr[i]);
 } 
var obj={
    a:1,
    be:2,
    c:3
}
for(var prop in obj){
    console.log(prop);		// 打印obj 的属性名	prop => 变量
    console.log(obj[prop]);	// 打印obj 的属性值
}

 

var obj={a:1,b:2,c:3};		
var o={};
for(var prop in obj){	// 使用 for in遍历时,会将所有属性包括下标转为字符型
    o[prop]=obj[prop];	// for in 遍历对象时,变量代表的是属性,遍历数组时,遍历代表的是下标
 }
obj.a=100;			// 浅复制  将对象 obj 复制到o中  obj和o没有引用关系 
console.log(o.a);		// 改变obj 中a 的值,不会影响o中a 的值
// 这样只能复制解除最外层的引用关系,当对象属性值为一个对象时,这种浅复制就不起作用了
var obj={
    a:1,
    b:{
        a:1,
        b:2
    }
}
var o={};
for(var prop in obj){
    o[prop]=obj[prop];
}
obj.a=10;
obj.b.a=10;			    // 这时 改变obj中 b的a的属性值 就会影响o中b的a的属性值
console.log(o);			 // 要解决这类问题,就考虑到对象深复制

 

——————————————————————————————————————————————————

 

for 和 for in的区别

  1. for in不会遍历空元素,for会遍历空元素=>undefined
  2. for in可以遍历到数组内所有的属性包括下标,for只能遍历数组所有下标

 

(属性包含字符和下标(数字))

arr[0]=5;  //   0就是arr的下标,也是arr的属性

arr["aa"]=10; //   aa就是arr的属性

 

in

x in arr 判断数组时,x表示下标=>arr数组中有下标为x的元素

x in obj 判断对象时,x表示对象的属性=>obj中有没有x属性

   

        

 //  这样可以完成不遍历空元素

var arr=[2,4,6,,8,10];

for(var i=0;i<arr.length;i++){

    if(!(i in arr))continue;
    console.log(arr[i]);

 } 

或者

for(var i=0;i<arr.length;i++){

    if(i in arr)console.log(arr[i]);

 }

________________________________________________

 

 

 

数组的方法

不管删除还是添加都会改变数组的长度

 

  • arr.push("a","b");

在数组尾部添加一个或者多个元素,并且返回数组的新长度

arr.push(6); //在数组的尾部插入一个新元素

arr.push(6,7,8); //在数组的尾部插入多个新元素

 

  • arr.unshift("a","b");

在数组头部添加一个或者多个元素,并且返回数组的新长度

arr.unshift(0); //在数组的头部插入一个新元素

arr.unshift(-3,-2,-1,0); //在数组的头部插入多个新元素

 

  • arr.pop(); //pop中没有参数,

删除数组的最尾部一个元素 , 并且将这个被删除的元素返回

arr.length--;  // 等同 速度更快,但是不会返回被删除的元素

arr.pop(); // 速度慢,但是会返回被删除的元素

 

var arr1=["a","b","c","d","e","f","g"];

while((arr1.pop())!="d"){}; // 先删除 删除后得到返回值再判断

console.log(arr1); // [ a,b,c ]

 

  • arr.shift() ; // shift 中没有参数

删除数组的第一个元素,并且返回被删除的元素

arr.shift();//将数组的第一个元素删除

 

     清空数组 ↓  

for(var i=0;i<arr.length;i++){

    arr.pop();

}   // 这样写,i会不断增大,length会不断减小,他们会相遇,所以不会全部删除

console.log(arr); 



var len=arr.length; // 上一个代码改进后

for(var i=0;i<len;i++){

    arr.pop();

}



for(var i=0;i<arr.length;){ // 也可以这样清空数组

   arr.pop();

}



while(arr.length>0){ // 也可以这样清空数组

      arr.pop();

}

 

 

重构pop方法

 

var arr=[1,2,3,4,5,6,7];
function pops(arr){
      var item=arr[arr.length-1];
      arr.length--;
      return item;
}
var item=pops(arr);
arr.pop();
console.log(arr,item);

重构unshift方法

 

function unshifts(arr,item){
    var maxIndex=arr.length-1;
    for(var i=maxIndex;i>=0;i--)     arr[i+1]=arr[i];
    arr[0]=item;
    return arr.length;
}
var n=unshifts(arr,5);
console.log(n,arr);

 

  • arr.concat(arr1);

数组的合并,合并后会返回一个新数组

var arr2=arr.concat(arr1); //合并两个数组,原来的两个数组不会变化,写在前面的数组,合并后也在前面

var arr3=arr.concat(0,-1,-2);        // 数组除了可以合并数组,也可以合并元素,将多个元素与原数组合并,返回新数组

var arr4=arr.concat(0,arr1,["A","B"]);        // concat既可以合并元素,也可以合并数组      

var arr5=arr.concat();         // 如果直接使用concat,就可以完成数组的复制功能

        

 

  • arr.join(); // 参数为字符串的连接符

将数组的每个元素以指定的字符连接形成新字符串返回 默认使用,连接

var str=arr.join("|");   // 以 | 作为字符串的连接符

var str=arr.join("");   // ""作为连接符,会将数组元素首尾相连成为字符串

 

重构join方法

 

function join(arr,separ){
     if(separ===undefined) separ=",";	// 默认情况使用 逗号分隔
     var str="";
     for(var i=0;i<arr.length-1;i++){	// 遍历数组,最后一个不遍历
         str+=arr[i]+separ;		 // 在str字符串上累加每一个元素和连接符
     }
     str+=arr[i];		 // 最后一个元素直接累加在最后
     return str;
 }
var str=join(arr,"|");
console.log(str); 

 

 

toString也可直接将数组转换为字符串

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

   var str=arr.toString();

   console.log(str); // 1,2,3,4,5 不能给参数 只能是逗号分隔

 

判断两个数组的内容是否相同

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

        var arr1=[1,2,3,4];

        console.log(arr1===arr); // 存在弊端 只能判断顺序和数量都相同 的数组

        if(arr.toString()===arr1.toString()){

            console.log("他们的内容是相同的")

   

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值