JavaScript 高级（一）基础总结

数据类型

①分类

1. 基本（值）类型
   String：任意字符串
   Number：任意数字
   boolean：true/false
   undefined：undefined
   null：null
2. 对象（引用）类型
   Object：任意对象
   Function：一种特别的对象（可以执行）
   Array：一种特别的对象（数值下标，内部数据是有序的）

②判断

1. typeof :返回数据类型的字符串表达。 可以判断undefined、数值、字符串、布尔值 、function；不能判断 null与Object 、Object与Array。
2. instanceof：判断对象的具体类型，function也可以用typeof来判断
3. ===：可以判断undefined、null

例子：

<script type="text/javascript">
        // typeof: 返回的是数据类型的字符串表达形式
        //1. 基本类型
        var a;
        console.log(a, typeof a, a===undefined); // undefined 'undefined' true
        console.log(a===typeof a); // false

        a = 3;
        console.log(typeof a === 'number');
        a = 'xyy';
        console.log(typeof a === 'string');
        a = true;
        console.log(typeof a === 'boolean');

        a = null;
        console.log(a===null); // true
        console.log(typeof a); // 'object'

        console.log('--------------------------------');

        //2. 对象类型
        var b1 = {
            b2: [2, 'abc', console.log],
            b3: function () {
                console.log('b3()')
            }
        };
        console.log(b1 instanceof Object, typeof b1); // true 'object'
        console.log(b1.b2 instanceof Array, typeof b1.b2); // true 'object'
        console.log(b1.b3 instanceof Function, typeof b1.b3); // true 'function'

        console.log(typeof b1.b2[2]); // 'function'
        console.log(b1.b2[2]('abc'));// 'abc' undefined
    </script>

基础问题

1. undefined与null的区别？
   undefined代表定义未赋值
   null定义并赋值了，只是值为null

2. 什么时候给变量赋值为null呢？
   ①初始赋值，表明将要赋值为对象
   ②结束前赋值，让对象成为垃圾对象（被垃圾回收器回收）

3. 严格区分变量类型与数据类型？
   ①数据的类型
   基本类型
   对象类型
   ②变量的类型（变量内存值的类型）
   基本类型：保存的就是基本类型的数据
   引用类型：保存的是地址值

数据-变量-内存

数据

1. 什么是数据?
   存储与内存中代表特定信息的东西，本质就是0101二进制。

2. 数据的特点：可传递、可运算

3. 万物(一切)皆数据, 函数也是数据

4. 程序中所有操作的目标: 数据
   算术运算
   逻辑运算
   赋值
   调用函数传参

变量

什么是变量?
值可以变化的量, 由变量名与变量值组成。

一个变量对应一块小内存, 变量名用来查找到内存, 变量值就是内存中保存的内容。

内存

1. 什么是内存?
   内存条通电后产生的可存储数据的空间（临时的）

2. 内存的产生和死亡: 内存条(集成电路板)——>通电——>产生一定容量的存储空间——>存储各种数据——>断电——>内存空间和数据全部消失

3. 内存的空间是临时的, 而硬盘的空间是持久的

4. 一块内存包含2个数据：
   ①内部存储的数据(一般数据/地址数据)
   ②内存地址值数据

5. 内存分类：
   栈: 全局变量, 局部变量 (空间较小)
   堆: 对象 (空间较大)

注意：内存,数据, 变量三者之间的关系？
内存是一个容器, 用来存储程序运行需要操作的数据。
变量是内存的标识, 我们通过变量找到对应的内存, 进而操作(读/写)内存中的数据。

基础问题

1. 关于赋值与内存的问题？
   var a = xxx, a内存中到底保存的是什么?

   ① xxx是一个基本数据，保存的就是这个数据
   ② xxx是一个对象，保存的是对象的地址值
   ③xxx是一个变量，保存的是xxx的内存内容（可能是基本数据类型，也可能是地址值）

2. 关于引用变量赋值问题？
   ① 2个引用变量指向同一个对象，通过变量修改对象内部数据，另一个变量看到的是修改后的数据
   ② 2个引用变量指向同一个对象，让其中一个变量指向另一个对象，另一引用变量依然指向前一个对象

例子：

<script>
        var obj1 = {name:'Tom'};
        var obj2 = obj1;
        obj2.age = 12;
        console.log(obj1.age);//12

        function fn(obj){
            obj.name = 'A';
        }
        fn(obj1);
        console.log(obj2.name);//A

        var a = {age:12};
        var b = a;
        a = {name:'BOB',age:13};
        b.age = 14;
        console.log(b.age,a.name,a.age);//14 Bob 13

        function fn2(obj){
            obj = {age:15};
        }
        fn2(a);
        console.log(a.age);//13
    </script>

3. 在JS调用函数传递变量参数时，是值传递还是引用传递？
   ①理解1：都是值（基本/地址值）传递
   ② 理解2：可能是值传递，也可能是引用传递（地址值）

4. JS引擎如何管理内存？
   ①内存生命周期
   分配小内存空间，得到它的使用权；存储数据，可以反复进行操作； 释放小内存空间。

   ②释放内存
   局部变量：函数执行完自动释放
   对象：成为垃圾对象 ==>垃圾回收器回收

<script type="text/javascript">
       var a = 3;
       var obj = {};
       obj = undefined;

       function fn(){
           var b = {};
       }

       fn();
       //b是自动释放的，b所指向的对象是在后面的某个时刻由垃圾回收器回收
    </script>

对象

1. 什么是对象？
   多个数据的封装体（用来保存多个数据的容器）
   一个对象代表现实中的一个事物
2. 为什么要用对象？
   统一管理多个数据
3. 对象的组成？
   属性：属性名（字符串）和属性值（任意类型）组成
   方法：一种特别的属性（属性值是函数）
4. 如何访问对象内部数据？
   ①.属性名 ：编码简单，有时不能用
   ②['属性名']：编码麻烦，能通用

基础问题

什么时候必须使用['属性名']的方式？
①属性名包含特殊字符： - 、空格
②属性名不确定
如：

<script type="text/javascript">
       var p = {};
       //1、给 p 对象添加一个属性：content-type: text/json;
        p['content-type'] = 'text/json';
        console.log(p['content-type']);

        //2、属性名不确定
        var propName = 'myAge';
        var value = 18;
        // p.propName = value;//不能使用
        p[propName] = value;
        console.log(p[propName]);
    </script>

函数

1. 什么是函数？
   实现特定功能的n条语句封装体。
   只有函数时可以执行的，其他类型的数据不能执行。
2. 为什么要用函数？
   提高代码的复用性
   便于阅读交流
3. 函数的3种不同角色
   ① 一般函数 : 直接调用
   ②构造函数 : 通过new调用
   ③对象 : 通过.调用内部的属性/方法
4. 如何定义函数？
   ①函数声明
   ②表达式

        function fn1(){//函数声明
            console.log('fn1()');
        }

        function fn2(){//表达式
            console.log('fn2()');
        }

5. 如何调用（执行）函数？
   ①直接调用：test();
   ②通过对象调用：obj.test();
   ③new调用：new test();
   ④临时让test成为obj的方法进行调用：test.call/apply(obj);

<script>
        var obj = {};
        function test2(){
            this.xxx = 'xyy';
        }
        //obj.test2();不能直接调用，obj根本就没有该方法
        test2.call(obj);//可以让一个函数成为指定任意对象的方法进行调用
        console.log(obj.xxx);

    </script>

回调函数

1. 什么是回调函数？
   ①你定义的
   ②你没有调用
   ③但最终它执行了(某个时刻或在某个条件下)
2. 常见的回调函数：
   ①dom事件回调函数：回调函数中的this：发生事件的dom元素
   ②定时器回调函数：回调函数中的this：window
   ③ajax请求回调函数
   ④生命周期回调函数

<button id="btn">测试点击事件</button>
    <script type="text/javascript">
        var btn = document.getElementById("btn");
        btn.onclick = function(){//dom事件回调函数
            alert(this.innerHTML);
        };

        //定时器：超时定时器/循环定时器
        setTimeout(function(){//定时器回调函数
            alert("到点了！");
        },2000);
    </script>

IIFE( 匿名函数自调用)

1. 理解
   全称: Immediately-Invoked Function Expression 立即调用函数表达式
   别名: 匿名函数自调用
2. 作用
   ①隐藏实现
   ②不会污染外部（全局）命名空间
   ③ 用它来编写JS模块

<script type="text/javascript">
        (function (){ //匿名函数自调用
            console.log("……");
        })();


        (function () {
            var a = 1;

            function test() {
                console.log(++a);
            };
            window.$ = function () { //向外暴露一个全局函数
                return {
                    test: test
                };
            };
        })();

        $().test();//①$是一个函数；②$执行后返回的是一个对象

    </script>

函数中的this

1. this是什么？
   任何函数本质上都是通过某个对象来调用的，如果没有直接指定就是window。
   所有函数内部都有一个变量this， 它的值是调用函数的当前对象
2. 如何确定this的值？

示例	this的值
test();	window
p.test();	p
new test();	新创建的对象
p.call(obj);	obj