第二周第一天笔记

61 阅读6分钟

一、***数组的基础(填坑):

1、创建数组:

    1、直接量:var arr=[值1,...];
    2、构造函数:var arr=new Array(值1,...);
    第二个方法有一个坑:new Array(num);//这句话的意思是:创建了一个长度为num的空数组,里面没有任何东西,只有无数的undefined

2、***面试题:按值传递:var a=x; var b=a; 修改a,b变不变,或者 修改b,a变不变

    1.传递的如果是原始类型:
        其实是复制了一个副本给对方,两者互不影响

    2.传递的如果是引用类型:js中不是原始类型,就是引用类型(函数、数组,都是引用类型)- 浅拷贝
        因为引用类型很大,比原始类型大得多,不可能保存在变量本地,只是保存了一个地址值而已,其实是赋值了自己的地址值给对方,两者用的是同一个地址值,一个修改另一个也会变化

2、***hash数组(关联数组):下标是可以自定义的

    为什么:索引数组的下标无具体的意义,不便于查找
    如何使用:
        1、创建:21、创建空数组:var arr=[];
                2、为数组添加自定义下标并且赋值:arr["自定义下标"]=新值;

        2、访问元素:arr["自定义下标"];

        3、强调:hash数组的length失效了,永远为0!
                遍历hash数组:不能再使用for循环,必须使用for in循环 - 其实for in代老师并不爱称呼他叫作一个循环,因为它不需要设置从哪里开始到哪里结束,纯自动化的,专门为了遍历hash数组存在的
                        for(var i in 数组名){
                                i;//下标
                                数组名[i];//当前次元素
                        }
                不止能遍历hash数组,也能遍历索引数组
                个人建议:索引数组依然是for,hash数组再使用for in

        4、***hash数组的原理:
                hash算法:将字符串,计算出一个尽量不重复的数字(地址值)
                         字符串内容相同,则计算出来的数字也一定是相同的
                添加元素:将自定义下标交给hash算法,得到一个数字(地址值),直接将你要保存的数据放到此地址保存起来
                获取元素:将指定的自定义下标交给hash算法,得到一个和当初保存时一样的数字(地址值),通过此地址找到你当初保存的数据,取出来使用

        5、js里面一切的东西都是对象,万物皆对象,除了undefined和null,【一切对象的底层都是hash数组】
        

学习这一块最大的目的:是为了对象做准备工作

3、*****数组的API:

    前辈们预定义了很多方法,等待我们学习,我们程序员只需要学会如何使用,就可以直接用上 - 这些方法只有数组可用
1.*arr 转 str:
    var str=arr.join("自定义连接符");

    固定套路:2个
        1、鄙视题:将数组里面的内容拼接为一句话/单词 - 无缝拼接,其实就是拼接了一个空字符串
                var arr=["h","e","l","l","o"," ","w","o","r","l","d"];
                var str=arr.join("");
                console.log(str);

        2、将数组拼接为DOM页面元素 - 第一次遇到数据渲染页面
                //拿数据
                var arr=["-请选择-","北京","南京","西京","东京","重庆","北京","南京","西京","东京","重庆","北京","南京","西京","东京","重庆","北京","南京","西京","东京","重庆","北京","南京","西京","东京","重庆","北京","南京","西京","东京","重庆"];
                //将数组拼接为页面标签字符串
                var str="<开始标签>"+arr.join("</结束标签><开始标签>")+"</结束标签>";
                //巧了:innerHTML能够识别标签
                sel.innerHTML=str;
2、*数组拼接:添加元素的新方式
    将你传入的实参全部拼接到arr的末尾
	var newArr=arr.concat(新值1,arr1,...);
	特殊:
                1、不修改原数组,只会返回一个新数组
                2、concat支持传入数组参数,悄悄的将你传入的数组打散为单个元素再拼接
3、*截取子数组:
    根据你传入的开始下标截取到结束下标
	var subArr=arr.slice(starti,endi+1);
	特殊:
		1、不修改原数组,只会返回一个新数组
		2、含头不含尾
		3、endi可以省略不写,如果省略,会从starti位置一直截取到末尾
		4、starti也可以省略,如果两个实参都省略,那么会从头到尾完全的复制一份:此操作也叫做深拷贝 - 复制了一个副本给对方
		5、支持负数参数,-1代表倒数第1个

-------------------这条线以上的API都是不修改原数组的-------------------------- -------------------这条线以上的API都是会修改原数组的--------------------------

4、*删插替:
    删除:var dels=arr.splice(starti,n);//n代表删除的个数
        特殊:虽然他直接修改原数组,但是也有返回值,返回的是被删除的数据组成的一个新数组,因为前辈们考虑到有可能删除的东西刚好是需要的东西,哪怕没有删除也会返回一个空数组
    插入:arr.splice(starti,0,新值,...);
        特殊:1、原starti位置的元素以及后续元素都会向后移动
              2、尽量的不要插入一个数组,会导致我们的数组一些是一维,一些是二维,遍历的时候就非常不方便
    替换:var dels=arr.splice(starti,n,新值,...);
        特殊:删除的个数和插入的个数不必相同
5、翻转数组:arr.reverse(); - 今日一见,此生无缘
6、数组排序:
    1、鄙视时:冒泡排序:前一个元素和后一个元素进行对比,如果前一个>后一个,两者就交换位置,但是做完一轮发现只有最大的一个数字到了最后,所以再开循环反复使用,固定公式:
            var arr=[31,21,54,4376,69,8,8,65,643,52,3,321,5,47,69,87,643,524];
            for(var j=1;j<arr.length;j++){
                    for(var i=0;i<arr.length-j;i++){
                            if(arr[i]>arr[i+1]){
                                    var m=arr[i];
                                    arr[i]=arr[i+1];
                                    arr[i+1]=m
                            }
                    }
            }
            console.log(arr);

    2、正式开发时:arr.sort();
            默认:将数组中的元素转为字符串后,再按位PK每个字符的unicode号(ASCII码)
            问题1:希望按照数字升序排列:
                    arr.sort(function(a,b){//此函数叫做匿名回调函数,回调函数不需要我们程序员调用,由前辈们创建好,我们学习如何使用即可,其实前辈们的sort方法悄悄的帮助我们调用了
                //	console.log(a);//后一个数字
                //	console.log(b);//前一个数字
                        return a-b;//如果a-b返回的是一个正数:说明后一个>前一个
                                   //如果a-b返回的是一个负数,说明后一个<前一个
                                   //如果a-b返回的是一个0,说明后一个==前一个
                                   //而sort方法会根据你返回的正数、负数、0,来自动考虑要不要交换位置
                        })

            问题2:希望按照数字降序排列:
                    arr.sort(function(a,b){
                            return b-a;
                    })

            强调:切记:1、以后只要网页上有功能带有排序,他的底层一定是数组,因为js中只有数组可以排序
                       2、以后只要网页上有随机的功能,那么他的底层一定用到了随机数公式!

作业扩展知识:(二级联动)

    关键点:31select专属事件onchange - 只有在选中项发生变化后才会触发
        2select专属属性selectedIndex - 获取到当前选中项的下标
        3、必须使用二维数组再次细分每个分类