Js第三天笔记（数组，函数，对象）

JS基础知识——（数组，函数，对象）汇总

Part1.数组

1.1 说明

js的一种数据结构，存放数据的。说白了就是一组数据就叫做数组

1.2 创建方法

        // 数组的创建方式
        // 1.new方法创建
        var arr1 = new Array();

        // 2.字面量方法创建
        var arr2 = [];

1.3 赋值

数组通过**下标（索引）**来访问数组里面的数据和赋值

*注意的是数组的下标是从0开始的

        // 1.new方法创建
        var arr1 = new Array();
        arr1[0] = 1
        arr1[1] = 'zs'
        console.log(arr1); //[1, "zs"]

1.4 访问

访问数组的数据需要通过数组的下标访问，由0开始

        var arr1 = new Array();
        arr1[0] = 1
        arr1[1] = 'zs'
        console.log(arr1); //[1, "zs"]
        console.log(arr1[0], arr1[1]); //1 "zs"

1.5 相关属性

属性1：arr.length（数组的长度）

        var arr1 = new Array();
        arr1[0] = 1
        arr1[1] = 'zs'
        console.log(arr1.length); //2

1.6 问题应用

遍历数组元素

        var arr = ['zs', 'lhh', 'hmm', 100, 99, 34]
            // 1.用长度遍历
        for (var i = 0; i < arr.length; i++) {
            console.log(i, arr[i])
                // 0 "zs"
                // 1 "lhh"
                // 2 "hmm"
                // 3 100
                // 4 99
                // 5 34
        }

        // 2.for in 循环遍历
        for (var k in arr) {
            console.log(k, arr[k], typeof arr[k])
                //0 zs string
                //1 lhh string
                //2 hmm string
                //3 100 number
                //4 99 number
                //5 34 number
        }

冒泡排序

        // 冒泡排序
        var a = [2, 6, 1, 77, 52, 25, 7];
        var b = 0;
        for (i = 0; i < a.length; i++) {
            for (j = i + 1; j < a.length; j++) {
                if (a[i] >= a[j]) {
                    // 如果大则互换
                    b = a[i];
                    a[i] = a[j];
                    a[j] = b;
                } // 如果小则不变位置
            }
        }
        console.log(a);

Part2.函数

2.1 说明

函数就是把解决某一问题的方法，函数封装就是把解决一类问题的方法写一个模板，可以重复使用

2.2 创建方法

        // 函数的3种主要创建方法
        // 1.函数声明
        function functionName(行参) {
            执行的代码
        }

        // 2.函数表达式
        var x = function(a, b) {
            return a * b
        };

        // 3.Function() 构造函数
        var myFunction = new Function("a", "b", "return a * b");
        var x = myFunction(4, 3);

2.3 带返回值的函数

返回值概念：函数执行完后，可以把执行的结果 通过 return 语法 返回给调用者

注意：retrun 后的代码不被执行

1. 函数返回值

function fn() {
}
console.log(fn());   // 如果没有return  返回的值是 undefined

2. 函数形参和实参 数量可以不一定匹配

function getSum(x, y, z) {
    return x + y + z;
}
console.log(getSum(1, 2, 3)); // 6 
console.log(getSum(1, 2, 3, 4)); // 6
console.log(getSum(1, 2)); // NaN

2.4 函数的argunments(封装冒泡排序)

arguments对象中存储了传递的所有的实参。arguments是一个伪数组（没有push,pop,unshit,shit等操作），因此及可以进行遍历。

        function max() {
            // 冒泡排序
            for (i = 0; i < arguments.length; i++) {
                for (j = i + 1; j < arguments.length; j++) {
                    if (arguments[i] >= arguments[j]) {
                        // 如果大则互换
                        b = arguments[i];
                        arguments[i] = arguments[j];
                        arguments[j] = b;
                    } // 如果小则不变位置
                }
            }
            return (arguments[arguments.length - 1]);
        }
        var a = max(2, 6, 1, 77, 52, 25, 7);
        console.log(a);

2.5 自执行函数

定义后直接执行的函数，可以防止命名冲突，因为局部变量都是在函数使用是生效，函数结束时销毁的

注意写法

(function () {
  alert('我是匿名函数，被自执行啦~~！');
})();

2.6 全局变量，局部变量，作用域链

• 全局作用域

  供所有代码执行的环境(整个script标签内部) 或者一个独立的js文件中

• 局部作用域（私有作用域）

  在调用函数的时候，会形成一个执行函数内代码的新环境。

• 全局变量

  • 在全局作用域下声明的变量叫做全局变量（在函数外部定义的变量）
  • 全局变量在代码的任何位置都可以使用
  • 特殊情况， 再函数内 不var 声明 的 变量 也是全局变量 （不建议使用）

• 局部变量

  • 在局部作用域下声明的变量叫做局部变量（在函数内部定义的变量）
  • 局部变量只能在该函数内部使用

预解析过程

• JavaScript解析器会在全局环境下查找 var、function关键字，变量只声明不赋值，函数声明不调用。

• 预解析只发生在当前作用域下

• 预解析也叫做变量、函数提升

  • 变量提升

    定义变量的时候，变量的声明会被提升到当前作用域的最上面，变量的赋值不会提升。

  • 函数提升

    JavaScript解析器首先会把当前作用域的函数声明提前到整个作用域的最前面

  • 变量名和函数名相同，优先执行 函数

• 执行过程

  • 变量赋值、函数调用、表达式运算等等。

Part3.对象

3.1 说明

1.对象是一类事物的实例，即是类的实例

2.对象里的数据是对对象特征的描述，也是抽象的表达

3.所以对象可以由键值对的形式描述

3.2 创建方法

         // 1.字面量直接创捷
        var star = {
            name: '许嵩',
            sex: '男',
            job: 'singer',
            work: function() {
                console.log('海蝶音乐总监')
            }
        }
        console.log('我的偶像' + star.name + star['sex'] + '是一个才子')
        star.work();

        // 2.new方法创捷
        var Obj = new Object()
        Obj.name = '雪中';
        Obj.writer = '总管';
        Obj.num = 120000;
        Obj.sale = function() {
            console.log('我现在好困，不知道写啥~~~')
        }
        console.log(Obj)
        console.log(Obj.name)
        Obj.sale()     

注意：以键值对写入一组数据的时候不同的数据之间要使用逗号分隔，而在new方法中，用逗号和分号间隔在vscode缩进表示方法不同

3.3 访问

因为是以键值对的形式存储，所以可以通过访问键得到他的值

对于键的访问就有两种方式

1. obt[‘key’]

2. obt.key

   值得注意的是，对象用中括号去访问的时候，必须加上引号，也就是说必须是一个string的数据

        var star = {
            name: '许嵩',
            sex: '男',
            job: 'singer',
            work: function() {
                console.log('海蝶音乐总监')
            }
        }
        console.log(star.sex); //男
        console.log(star[name]); //undefined
        console.log(star['name']); //许嵩

3.4 问题应用

遍历对象元素

var obj = {
     name: 'andy',
     age: 18,
     sex: '男'
}
console.log(obj.length); // undefined
for (var k in obj) {
    console.log(k); // 这里的k 是属性名
    console.log(obj[k]); // 这里的 obj[k] 是属性值
}

小结

​ 对于数组和对象来说，它们都是存储大批数据的一种结构（因为基本的数据结构没办法满足我们的需求），所以归根结底他们都是一种特殊的方式存储数据。那么针对特殊的方式我们肯定有特殊的方法，这也就延伸出相关的数组的方法和对象的方法，理解这些方法和操作就需要我们结合实际需求。毕竟创造这些方法就是为了服务我们对这些数据的处理嘛

​ 对于函数，就是我们把解决问题的方法模块封装起来，这需要我们的归纳总结能力，而函数里面的一些属性，比如arguments对象就是方便我们去抽象参数的。而return就是我们使用函数的实质意义——获取经过函数处理过的结果。这个结果可以被我们使用其实这就是为什么说函数可以当作一个变量去使用。

​ 在对象里面，我们不仅可以自己构造对象，js也帮我们封装了一些内置对象，这些对象也是为了方便我们解决一些需求。在下一天的笔记整理当中，我们对于这些内置对象进行分析。从实际应用的角度去探讨他们的共性和差异。