JavaScript-day05

复习:


    1、函数的内部属性    
        只有在函数内部才能访问的属性
        1. 形参    
            a -> 1
            b -> 2
        2. arguments (类数组对象)
            函数接受的所有参数真正存储的地方
            1,2,3,4,5
        3. this
            this指向与函数的调用方式有关
                函数名(实参);
                函数名.call(实参列表);
                函数名.apply(实参数组);
            结论:
                1. 函数如果使用的是()调用,那就看一下()前面的变量是不是一个函数,如果是,再看函数名前面有没有对象
                    如果有对象,this指向该对象
                    如果没有对象
                        nodejs this指向global全局对象
                        浏览器 this指向window对象
                2. 如果函数使用call、apply调用,this指向用户手动指向的对象
                    var pig = {
                        words:'哼哼',
                        sound:function(){
                            console.log(this.words)
                        }
                    }
                    var dog = {
                        words:'汪汪'
                    }
                    pig.sound(); // 哼哼
                    pig.sound.call(dog); // 汪汪

        function sayName(a,b){
            console.log(this);
            console.log(arguments);
            return a + b;
        }

        var result = sayName(1,2,3,4,5);
        console.log(result);

    2、闭包
        函数中包含另一个函数

            function fn1(){
                var name = 'xpf';
                console.log(age);
                function fn2(){
                    var age = 25;
                    console.log(name);
                }
                fn2();
            }
            fn1();

    3、立即执行函数、匿名函数
        (function(a,b){
            console.log(a+b); // 3
        })(1,2);

    4、数组
        1. 特点
            1) 以[]为边界
            2) 数组的组成称为元素/项
            3) 元素与元素之间通过逗号分割
            4) 元素的数据类型没有限制

        2. 定义方式
            1) 数组字面量
                var arr1 = [];
                var arr2 = [1,2,3];
                arr2[arr2.length] = [4];
            2) Array构造函数
                var arr3 = new Array();
                注意:
                    如果传递的是一个数字,会按照这个数字创建给定项数的数组
                    var arr4 = new Array(3);
                    =>
                    [,,,]

        3. 数组的访问
            数组名[索引]
                索引从0开始
            var arr = [1,2,3];
            console.log(arr[1]); // 2

            注意:
                如果指定索引上的位置没有元素,返回undefined

        4. 数组的属性
            length
            var arr = [1,2,3];
            console.log(arr.length); // 3

学习    
        5. 数组的遍历
            1) for循环
            2) while循环
            3) do-while循环

            var arr = ['hello','world','xpf'];
            //将数组的长度赋值给length变量
            var length = arr.length;
            for(var i=0;i<length;i++){
                //i是当前遍历数组的索引
                console.log(i);
                //arr[i]就是当前遍历数组的每一项
                console.log(arr[i],'---');
            }

            4) for-in 增强for循环
                var arr = ['hello','world','xpf'];
                for(var key in arr){
                    //key是当前遍历数组的索引
                    console.log(key);
                    //arr[key]就是当前遍历数组的每一项
                    console.log(arr[key]);
                }

        6. 判断是否数组
            Array.isArray()

            var arr = [1,2,3,4];
            var obj = {
                name:'xpf',
                age:25,
                gender:'male'
            }
            console.log(Array.isArray(arr)); // true
            console.log(Array.isArray(obj)); // false


            拓展:
                instanceof 引用数据类型
                    判断某一个变量是否某一个构造函数的实例
                typeof    基本数据类型

                var arr = [1,2,3,4];
                console.log(arr instanceof Array); // true
                console.log(arr instanceof Object); // true

                原型链
                    爷爷奶奶        Object构造函数
                    父母            Array构造函数、原型
                    你            arr实例

        7. 数组API
            数组构造函数原型中的方法,即数组实例都可以调用
            Array.prototype.push()
            Array.prototype.pop()
            Array.prototype.shift()
            Array.prototype...

            api
                含义;参数;返回值

            1) 添加元素、删除元素相关 【改变了原数组】
                push()
                    含义:在数组的最后添加元素
                    参数:要添加的元素
                    返回值:返回新增了元素之后的数组的长度

                    添加一个元素
                        var arr = [1,2,3];
                        var name = 'xpf';
                        var result = arr.push(name);

                        
                        console.log(arr); // [1,2,3,'xpf']
                        console.log(result); // 4
                    添加多个元素
                        var arr = [1,2,3];
                        var name = 'xpf';
                        var age = 25;
                        var gender = 'male';
                        var result = arr.push(name,age,gender);

                        console.log(arr); // [ 1, 2, 3, 'xpf', 25, 'male' ]
                        console.log(result); // 6

                pop()
                    含义:从数组的最后取出一个元素
                    参数:无
                    返回值:返回被删除的元素

                    var arr = [1,2,3,4,'zhangsan'];
                    var result = arr.pop();

                    console.log(arr); // [1,2,3,4]
                    console.log(result); // zhangsan
                    注意:就算在pop()的小括号里面加了参数,也没效果

                    var arr = [1,2,3,4,'xpf'];
                    arr.pop();
                    arr.pop();
                    arr.pop();

                    console.log(arr); // [1,2]

                shift()
                    含义:将数组中第一个元素删除
                    参数:无
                    返回值:被删除的元素

                    var arr = ['hello','world','xpf','tom'];
                    var result = arr.shift();

                    console.log(arr); // [ 'world', 'xpf', 'tom' ]
                    console.log(result); // hello

                unshift()
                    含义:将元素添加到数组的最前面
                    参数:要新增的元素
                    返回值:新增了元素之后的新数组的长度

                    var arr = ['hello','world','xpf','tom'];

                    var age = 25;
                    var gender = 'male';
                    var result = arr.unshift(age,gender);

                    console.log(arr); // [25,'male','hello','world','xpf','tom']
                    console.log(result); // 6

            2) 排序方法 【改变原数组】
                sort()

                var arr = [3,2,4,1,6];
                console.log(arr.sort()); // [1,2,3,4,6]

                买家秀和卖家秀
                    需要对一下数组进行排序,从小到大
                        排序前:var arr = [3,2,1,12,21];
                        排序后:arr = [1,2,3,12,21];

                    代码一:
                        var arr = [3,2,1,12,21];
                        var result = arr.sort();
                        console.log(result);    // [ 1, 12, 2, 21, 3 ]
                    代码二:
                        使用比较器函数
                        arr.sort(比较器函数)
                            比较器函数也称为匿名函数,可以接两个参数a,b
                                当a>b时返回1,从小到大排序
                                当a<b时返回-1,从大到小排序

                        var arr = [3,2,1,12,21];
                        var result = arr.sort(function(a,b){
                            if(a>b){
                                return 1;
                            } else {
                                return -1;
                            }
                        });
                        console.log(result); // [1,2,3,12,21]

            3) 数组序列化 【不改变原数组】
                如何将一个数组转换为字符串?
                    var arr = [1,2,3,4]
                    ->
                    1,2,3,4

                1. toString()
                    含义:将数组转换为字符串,数组中的元素通过逗号连接
                    参数:无
                    返回值:转换后的字符串
                        var arr = [1,2,3,4];

                        var result = arr.toString();
                        console.log(arr,'arr'); // [1,2,3,4]
                        console.log(result); // 1,2,3,4
                        console.log(typeof(result)); // string

                2. join()
                    含义:将数组转换为字符串
                    参数:可有可无
                    返回值:转换后的字符串
                        var arr = [1,2,3,4];
                        ->
                        1234
                        1 2 3 4
                        1-2-3-4
                        1+2+3+4

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

                        var result1 = arr.join();
                        var result2 = arr.join('');
                        var result3 = arr.join(' ');
                        var result4 = arr.join('-');
                        var result5 = arr.join('*');

                        console.log(arr); // [1,2,3,4]
                        console.log(result1); // 1,2,3,4
                        console.log(result2); // 1234
                        console.log(result3); // 1 2 3 4
                        console.log(result4); // 1-2-3-4
                        console.log(result5); // 1*2*3*4

                3. JSON.stringify()
                    含义:将数组转换为json字符串
                    参数:需要转换的数组
                    返回值:转换后的json字符串
                        var arr = [1,2,3,4,5];
                        var result = JSON.stringify(arr);

                        console.log(arr); // [1,2,3,4,5]
                        console.log(Array.isArray(arr)); // true
                        console.log(result); // '[1,2,3,4,5]'
                        console.log(typeof(result)); // string

            4) 数组截取方法
                1. concat() 【不改变原数组】
                    含义:将参数中的数组和使用该方法得数组合并为一个数组
                    参数:一个或多个数组
                    返回值:合并后的数组

                        var arr1 = [1,2,3];

                        var arr2 = arr1.concat([4,5,6]);
                        var arr3 = arr1.concat(['hello','world'],['xpf','tom']);
                        console.log(arr1); // [1,2,3]
                        console.log(arr2); // [1,2,3,4,5,6]
                        console.log(arr3); // [1,2,3,'hello','world','xpf','tom']

                2. slice() 【不改变原数组】
                    含义:从使用了改方法的数组中截取一个子数组
                    参数:一个或者两个数字
                    返回值:返回截取到的子数组

                    一个参数:
                        var arr1 = [1,2,3,4,5];

                        var arr2 = arr1.slice(2);
                        var arr3 = arr1.slice(5);
                        console.log(arr1); // [1,2,3,4,5]
                        console.log(arr2); // [3,4,5]
                        console.log(arr3); // []

                        如果只传递了一个参数,截取到的就是索引从该位置开始之后所有的项,做为新数组,如果该值超过了原数组的最大索引,返回的将是一个空数组

                    两个参数:
                        slice(a,b)
                            a -> 起始位置
                            b -> 结束位置
                        如果传递的是两个参数,截取子数组的时候,包含起始位置,不包含结束位置
                        var arr1 = [1,2,3,4,5];
                        var arr4 = arr1.slice(2,3);
                        console.log(arr4); // [3]

                    三个或者多个参数:
                        多余的参数没有效果

                3. splice()    【改变原数组的值】
                    含义:从使用了该方法的数组中删除、新增、修改操作
                    参数:一个或者多个
                    返回值:删除的元素组成的新数组

                    一个参数:
                        var arr1 = [1,2,3,4,5];
                        var arr2 = arr1.splice(1);

                        console.log('arr1',arr1); // [1]
                        console.log('arr2',arr2); // [2,3,4,5]

                        删除该位置之后的所有元素,被删除的元素组成一个新数组

                    两个参数:
                        var arr1 = [1,2,3,4,5];
                        var arr2 = arr1.splice(1,3);

                        console.log('arr1',arr1); // [1,5]
                        console.log('arr2',arr2); // [2,3,4]

                        删除第一个参数之后,项数为第二个参数的元素,被删除的元素组成一个新的数组

                    三个参数:
                        var arr1 = [1,2,3,4,5];
                        var arr2 = arr1.splice(1,3,9);

                        console.log('arr1',arr1); // [1,9,5]
                        console.log('arr2',arr2); // [2,3,4]

                        删除第一个参数与第二个参数之间的项(起始位置和结束位置都包含),被删除的元素组成一个新的数组,同时将第三个参数放到被删除的位置上

            5) 数组迭代方法
                forEach(function(){})
                    用法:遍历当前数组
                    参数:function(item,index,arr){}
                        每遍历一次,这个匿名函数就会被调用一次,forEach将当前遍历的元素、索引、当前数组,作为实参传递给这个匿名函数
                    返回值:无

                    var arr = ['hello','world','zhangsan'];

                    var result = arr.forEach(function(item,index,arr){
                        console.log('item',item); // 当前遍历的数组中的每一个元素
                        console.log('index',index); // 当前遍历的数组的每一个元素的索引
                        console.log('arr',arr); // 当前遍历的数组
                    })
                    console.log(result); // undefined

                every()    
                    用法:判断一个数组中的所有元素是否都满足给定的条件
                    参数:function(item,index,arr){}
                    返回值:
                        当每次回调函数返回值都为true的时候,every方法的返回值才为true
                        只要回调函数有一次的返回值为false,every方法都返回false
                        var arr = [1,2,3,4,5];
                        var result = arr.every(function(item,index){
                            return item > 3;
                        });
                        console.log(result); // false

                some()
                    用法:判断数组中是否有满足条件的元素
                    参数:function(item,index,arr){}
                    返回值:
                        只要回调函数有一次的返回值为true,some方法都返回true
                        var arr = [1,2,3,4,5];
                        var result = arr.some(function(item,index){
                            return item > 3;
                        });
                        console.log(result); // true

                filter()
                    用法:筛选数组中满足条件的元素(过滤)
                    参数:function(item,index,arr){}
                    返回值:
                        只要有满足给定条件的元素时,返回这些元素组成的数组

                        var arr = [1,2,3,4,5];
                        var result = arr.filter(function(item,index){
                            return item > 3;
                        });
                        console.log(result); // [4,5]

                map()
                    用法:使用给定条件处理数组(映射)
                    参数:function(item,index,arr){}
                    返回值:
                        返回一个处理后的数组

                        var arr = [1,2,3,4,5];
                        var result = arr.map(function(item,index){
                            return item > 3;
                        });
                        console.log(result); // [fasle,false,false,true,true]

                        var arr = [1,2,3,4,5];
                        var result = arr.map(function(item,index){
                            return item + 3;
                        });
                        console.log(result); // [4,5,6,7,8]

            *6) 类数组对象转换为数组
                jQuery    

                1. [...arguments],改方法只对拥有迭代器的有效
                2. Array.from(arguments)
                3. Array.prototype.slice.call(arguments)

                function sayName(a,b){
                    console.log([...arguments]);
                    console.log(Array.from(arguments));
                    console.log(Array.prototype.slice.call(arguments));
                }

                sayName(1,2,3);

                obj是我们自己创建的一个具有迭代器的类数组对象
                var obj ={
                    0:'a',
                    1:'b',
                    length:2,
                    [Symbol.interator]:Array.prototype[Symbol.interator]
                }
                console.log([...obj]); // ['a','b']

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值