04数组

数组的概念:

字面意思上是一组数据,一组(一般情况下相同类型的)的数据(不一定都是数字)
〖注〗数组是一种数据类型
〖注〗数组的作用是:使用单独的变量来存储一系列的值。

数组的创建方式

1 使用new 运算符创建数组

参数:是我们要在数组中存储的数据; 参数:如果当前的参数只有一个,并且这个参数是数字的发,数字长度为该数字,数字中的每个值为空;

var arr=new Array(1,2,true,"hello"); //[1,2,true,"hello"]
var arr1=new Array(5);  //[enpty*5 ]

2 省略运算符创建数组

var arr=Array(1,2,true,'hehe')

3.通过字面量来创建数组
〖注〗:

  1. 在数组中存储的数据,一般情况下叫做数组中的元素;
  2. 数组元素的访问是通过下表完成的;
var arr=[1,2,true,'hehe']

之前创建数组的方式存在的问题

  1. 如果没有传递参数,得到的是空数组
  2. 如果传递一个数字参数,得到是带有长度的空数组
  3. 如果传递一个非数字参数,得到的带有一个成员的数组
  4. 如果传递多个参数,得到的是一个多个参数的数组
//之前创建数组的方式
        console.log(Array());//[]
        console.log(Array(10));// [empty × 10]
        console.log(Array("a"));//["a"]
        console.log(Array(1,2));//[1, 2]
  1. ES6 **Array.of()**创建数组(实现将传递的每一个参数,都作为数组的成员)
        //ES6中拓展的of方法
        console.log(Array.of());//[]
        console.log(Array.of(10));//[10]
        console.log(Array.of('a'));//["a"]
        console.log(Array.of(1,2));//[1, 2]

实现Array.of()的方法

        Array.icktOf=function(){
            return Array.prototype.slice.call(arguments)
        }
        console.log(Array.icktOf());//[]
        console.log(Array.icktOf(10));//[10]
        console.log(Array.icktOf('a'));//["a"]
        console.log(Array.icktOf(1,2));//[1, 2]

**arr.length(数组的长度)**访问数组元素的个数
〖注〗: length属性,不只是读的,可以设置的.

var arr=[1,2,true,'hehe'];
console.log(arr.length);//4
arr.length=2 ;
console.log(arr);//[1,2]

数组元素的访问和赋值,都是通过数组的下标完成。(下标可以是变量或者表达式。)

〖注〗下标就是索引,即元素的序号,从0开始,下标最大取值是:数组的长度(length-1) 〖注〗下标可以是变量或者表达式。

数组遍历:数组和循环结合使用。JS中数组和循环是绝配。

var  arr=[1,2,true,'hehe']
//for循环遍历
for(var i;i<arr.length;i++){
	document.write(arr[i]+"<br>")
}
/*
for...in 进行遍历 快速遍历 将数组的某一个元素从头到位遍历一遍
〖格式〗
for(var 变量 in 数组){

}
*/
for(var i in arr){
//i 每一次遍历的下标
	document.write(arr[i]+"<br>")
}
/* 〖注〗  for...in效率比for循环效率高(不需要进行判断)*/

**
栈结构:从一个口进,从同一个口出
特点:先进后出**

数组的栈方法(改变原数组的结构)

push()方法
功能:在原数组末端添加项,
返回值:len=arr.push() //添加元素以后,数组的长度 `

unshift()方法
功能:在原数组的前端添加项
返回值:len=arr.unshift() //添加元素以后,数组的长度

pop()方法:
功能:从原数组末端移除项,
返回值:返回被删除的元素
返回值:len=arr.pop() //返回被删除的元素

shift()方法:
功能:从原数组末端移除项,
返回值:返回被删除的元素
返回值:len=arr.shift() //移除数组中的第一项,返回被删除的元素**

<script>
    //push()方法:从数组末端添加项
    var colors=new Array("red","green");
    var len=colors.push("blue","yellow","black");
 	console.log(colors);//["red","green","blue","yellow","black"]
 	console.log(len);//5
    //unshift()方法:在数组的前端添加项
    var nums=[2,6,7,9];
    var size=nums.unshift(99,66);
    console.log(nums);//[99,66,2,6,7,9]
    console.log(size);//6
    //pop()方法:从数组末端移除项,返回被删除的元素
    var n=nums.pop();
    console.log(nums);//[99,66,2,6,7]
    console.log(n);//[9]
    //shift()方法:移除数组中的第一项,返回被删除的元素
    var m=colors.shift();
    console.log(colors);//["green","blue","yellow","black"]
    console.log(m);//["red"]
</script>

reverse():数组翻转
arr[1,2,3,4,5] —— arr.reverse() ----[5,4,3,2,1]
两个组合在一起:reverse().join() 翻转数组并转为字符串

  var nums=[2,4,5];
  nums.reverse();
  console.log(nums);//[5, 4, 2]
  var strs=["a","b","c","d"]
  //返回dcba这个字符串
  var newstr=strs.reverse().join("")
  console.log(newstr);//dcba

sort():数组排序 sort会将数组里的值转成字符串再比较,所以排序数字大小要用函数function来比较
arr.sort(function(a,b) {return b - a}) ——降序
arr.sort(function(a,b) {return a - b}) ——升序

  var arr=[9,23,15,-99,88,12,-2];
  //降序
  // arr.sort((a,b)=>{return b-a});
  //console.log(arr);//[88, 23, 15, 12, 9, -2, -99]
  //升序
  arr.sort((a,b)=>{return a-b});
  console.log(arr);// [-99, -2, 9, 12, 15, 23, 88]

splice()方法
arrayObject.splice(index,count,item1,…itemX)
功能:在指定位置插入值,且同时删除任意数量的项
参数:
index:起始位置 ;
count:要删除的项数 ;
item1,…itemX:要插入的项。

  var arr=["a","v","c","d","e","f","g"]
  //删除
  // var delArr=arr.splice(2,3);
  // console.log(arr);//["a", "v", "f", "g"]
  // console.log(delArr);// ["c", "d", "e"]
  //插入,从原始数组中删除的项(如果没有删除任何项,则返回空数组)**
  var insertArrarr=arr.splice(3,0,'m','n')
  console.log(arr);//["a", "v", "c", "m", "n", "d", "e", "f", "g"]
  console.log(insertArrarr);//[]

数组方法(不改变原数组的结构)

join()
把数组转换成字符串,分割字符串默认用 逗号"," 分隔,
指定分隔符号: join("-")表示用 - 进行字符串分割

 var nums=[2,4,5];
  var str=nums.join();
  console.log(str);//2,4,5
  var words=['border','left','color'];
  //实现border-left-color
  var wordstr=words.join("-");
  console.log(wordstr);border-left-color

concat():数组拼接
arrayObject.concat(arrayX, arrayX,…,arrayX)]
用于连接两个或多个数组,返回值,数组

    var arr1=["a","b","d"];
    var arr2=["e","f"];
    var arr3;
    //concat
    arr3=arr1.concat(arr2,["q",8,"u"])
    console.log(arr3);// ["a", "b", "d", "e", "f", "q", 8, "u"]

slice():
arrayObject.slice(start, end)
从已有的数组中返回选定的元素,返回值,数组
start(必需),规定从何处开始选取,如是负数,从数组尾部开始算起(即该数组的索引长度加负数开始算起);
end(可选) 规定从何处结束选取,是数组片段结束处的数组下标
注意:
1. start和end指的是数组中的索引值
2. 截取从start到end(不包含该元素)的元素,即从start到(end-1)的元素

  var colors=["red","green","blue","yellow","orange"];
  //slice
  var newColors=colors.slice(1,3);
  console.log(newColors) //["green","blue"]

ES5中的方法 indexOf() lastIndexOf()
indexOf(value,Index); 从数组的 开头 开始向后查找;查找类型需相等,否则返回-1;
lastIndexOf(value,Index); 从数组的 末尾 开始向前查找;查找类型需相等,否则返回-1;

   var nums=[1,7,7,4,3,7,8,9]
    var pos=nums.indexOf(7,2);// 2
    var pot=nums.lastIndexOf(7);// 5
    console.log(pos,pot)
    //封装一个方法实现indexOf的功能
    function ArrayIndexOf(arr,value){
        //检测Value在arr中出现的位置
        for(var i=0;i<arr.length;i++){
            if(arr[i]===value){
                return i;
            }
        }
        return -1;
    }
    console.log(ArrayIndexOf(nums,7)) //1

ES6中拓展了find() findIndex()
允许参数是可以执行的函数,在***查找的过程中,一旦找到立刻停止遍历***
find((item,index,arr)=>{return})查找成员,找到返回成员,没找到返回undefined
findeIndex(((item,index,arr)=>{return})查找成员,找到返回索引值,没找到返回undefined

        let arr = ['尼古拉斯赵四', '宋小宝', '刘能', '小沈阳'];
        //arr.find(function(item,index,arr){})
        let result=arr.find((item,index,arr)=>{
            return item==="宋小宝"
        })
        console.log(result);//宋小宝
        let result1=arr.findIndex((item,index,arr)=>{
            return item==="宋小宝";
        })
        console.log(result1);//1

find 方法的实现

        let arr = ['尼古拉斯赵四', '宋小宝', '刘能', '小沈阳'];
        Array.prototype.icktFind=function(fn){
            //遍历数组 就是遍历this
            for(let i=0;i<this.length;i++){
                //判断并执行fn
                //传递三个参数:成员值 this[i] 索引值i  原数组this
                if(fn(this[i],i,this)){
                    //返回成员
                    return this[i];
                }
            }
            //遍历完成没有找到 则返回undefined
            return undefined;
        }
        let result=arr.icktFind((item,index,arr)=>{
            return item==="宋小宝"
        })
        console.log(result);//宋小宝

自定义实现findeIndex

        let arr = ['尼古拉斯赵四', '宋小宝', '刘能', '小沈阳'];
        Array.prototype.icktFindIndex=function(fn){
            //遍历数组 就是遍历this
            for(let i=0;i<this.length;i++){
                //判断并执行fn
                //传递三个参数:成员值 this[i] 索引值i  原数组this
                if(fn(this[i],i,this)){
                    return i;
                }
            }
            //遍历完成没有找到 则返回undefined
            return undefined;
        }
        let result=arr.icktFindIndex((item,index,arr)=>{
            return item==="宋小宝"
        })
        console.log(result);//1

二维数组 所谓二维数组,在数组中元素还为数组

var arr=[[],[],[],[],[]] //二维数组

通过循环按行顺序为一个5×5的二维数组a赋1到25的自然数,然后输出该数组的左下半三角。试编程。
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
如图
6
11 12
16 17 18
21 22 23 24

    var count=0;//从1到25累加中间变量
    var arr=[];
    for(var i=0;i<5;i++){
        var newArr=[];
        for(var j=0;j<5;j++){
            newArr.push(++count)
        }
        arr.push(newArr)
    }

    for(var i=0;i<arr.length;i++){
        for(var j=0;j<i;j++){
            document.write(arr[i][j]+"&nbsp;&nbsp;")
        }
        document.write('<br>')
    }

数组引用详解

〖注〗声明在当前函数中的变量和当前函数的形参,作用域都限制在该函数内。当函数调用结束以后,这些变量和形参,会被释放。

var a=10;
 function show(a){
     a=5;
     alert(a);
 }
 alert(a);//10
 show(a);//5
 alert(a);//10

数组 复合数据类型/引用数据类型

〖注〗所有的复合数据类型都不直接存储在我们的函数中,存储在堆段。
〖注〗函数运行的内存空间是预先分配好的。一旦被分配好内存空间,就不能进行改变了。
〖注〗在堆段,我们可以想要使用内存,就随时分配多少内存。
〖注〗所有的复合数据类型,存储的都是门牌号,也就是地址。所以这类型的数据,我们叫做引用数据类型。

var arr=[10,20];
function show(arr){
    arr.push(30,40)
    alert(arr)
}
    alert(arr);//arr=[10,20];
    show(arr);//arr=[10,20,30,40];
    alert(arr);//arr=[10,20,30,40];
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值