JavaScript学习笔记（JS进阶）_javascript进阶笔记

1.数据类型

1. 分类

• 基本数据类型(值类型)

  • String 任意字符串
  • Number 任意的数字
  • Boolean true false
  • undefined undefined
  • null null
  • Symbol

• 对象（引用类型）

  • Object 任意对象都是Object类型
  • Function 一种特别的对象（可以执行）
  • Array 一种特别的对象（数值下标属性，内部数据是有序的）

2. 判断

• typeof

  • 返回数据类型的字符串表达式
  • 可以判断undefined/数值/字符串/boolean/function
  • 不能判断 null/Object Object与Array

• instanceof

  • 判断对象的具体类型 Object、Array、Function

• ===

  • 可以判断undefined/null

3. 什么是实例？

   实例就是实例对象 构造函数是类型对象 根据类型创建实例对象

      // 实例  实例对象
      // 类型  类型对象

      function Person(name, age) {  //构造函数 类型
        this.name = name;
        this.age = age;
      }
      var p = new Person("ycj", 11);  // 根据类型创建的实例对象
      console.log(p);
1
2
3
4
5
6
7
8
9

面试题

1. undefined和null的区别？

   undefined代表定义了没有赋值 null代表定义了也赋值了 赋值为null

2. 什么时候给变量赋值为null？
   初始赋值为null，表明将要赋值为null，确定了对象再赋值
   在最后设置b = null，为了让对象成为垃圾对象（被垃圾回收器回收）

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

2.数据、变量、内存

1. 什么是数据？
   存储在内存中代表特定信息的，本质是0101
   数据的特点：可传递 ，可运算
   一切皆数据
   内存中所有操作的目标都是数据 算术运算，逻辑运算，赋值运算，运行函数
2. 什么是内存?
   可存储数据的空间（临时的）
   一小块内存中的2个数据 内部存储的数据 地址值
   内存的分类
   • 栈 ：全局变量/局部变量
   • 堆：对象
3. 什么是变量？
   可变化的量，由变量名和变量值组成
   每个变量都对应一小块内存，变量名用来查找对应的内存，变量值就是内存中保存的数据
4. 三者的关系

• 内存是用来存储数据的空间
• 变量是内存标识

思考：

1. var a = xxx，a内存中保存的是什么？

* xxx是基本数据，保存的就是这个数据
* xxx是对象，保存的是对象的地址值
* xxx是一个变量，保存的是xxx的内存内容（可能是基本数据，也可能是地址值）
1
2
3

2. 关于引用变量赋值问题
   • 多个引用变量指向同一个对象，通过一个变量修改对象内部数据，其它所有变量看到的是修改之后的数据
   • 两个引用变量指向同一个对象，让其中一个引用变量指向另一个对象，另一个引用对象
3. 在js调用函数时传递变量参数时，是值传递函数引用传递？
   • 理解1：都是值（基本/引用）传递
   • 理解2：可能是值传递，也可能是引用传递（地址值）
4. JS引擎如何管理内存
   • 内存生命周期
     • 分配小内存空间，得到小内存空间的使用权
     • 存储数据，可以反复进行操作
     • 释放小内存空间
   • 释放内存
     • 局部变量：函数执行完，自动释放
     • 对象：成为垃圾对象==> 垃圾回收器回收

3.对象

1. 什么是对象？
   多个数据的封装体 用来保存多个数据的容器 一个对象代表现实世界中的一个事物
2. 为什么要使用对象?
   统一管理多个数据
3. 对象的组成
   属性 属性名（字符串） 和属性值（任意类型）组成
   方法 一种特别的属性（属性值是函数）
4. 如何访问对象内部的数据？
   .属性名 编码简单 有时不能用
   [‘属性名’] 编码复杂 通用
   • 什么时候必须使用[‘属性名’]的方式？
     属性名包含特殊字符：- 空格
     属性名不确定

4.函数

1. 什么是函数?
   实习特定功能的n条语句的封装体
   只有函数是可以执行的，其它类型的数据不能执行
2. 为什么要用函数?
   提高代码复用 便于阅读交流
3. 如何定义函数?
   函数声明 函数表达式
4. 如何调用（执行）函数?
   test():直接调用
   obj.test():通过对象调用
   new test():new调用
   test.apply/call(obj):临时的让test成为obj的方法进行调用
5. 什么是回调函数？
   自己定义的 自己没有调用 最终执行了
6. 常见的回调函数
   dom事件回调函数
   定时器回调函数
   ajax请求回调函数
   生命周期回调函数

5.IIFE

立即执行函数 匿名函数自调用 用来编写js模块
把一个函数整体用（）括起来，看作是一个匿名函数，然后立即调用

 (function () {
 		var a = 3;
        console.log(a+3);
      })();   // 6
1
2
3
4

为什么要用IIFE？
隐藏实现，隐藏函数的具体实现，只返回一个结果
不会污染外部（全局）命名空间

6.this

1. this是什么？
   任何函数本质上都是通过某个对象来调用的
   所有函数内部都有一个变量this
   它的值是调用函数的当前对象
2. 如何确定this的值
   test():window
   p.test():p
   new test()：新创建的对象
   p.call(obj):obj

7.原型与原型链

原型

1. 函数的prototype属性
   每个函数都有一个prototype属性，它默认指向一个Object空对象（即称为：原型对象）
   原型对象中有一个属性constructor，它指向函数对象
2. 给原型对象添加属性（一般都是方法）
   作用：函数的所有实例对象自动拥有原型中的属性（方法）

显示原型和隐式原型

1. 每个函数function都有一个prototype，即显示原型
2. 每个实例对象都有一个__proto__，可称为隐式原型
3. 对象的隐式原型的值为其对应构造函数的显式原型的值
4. 内存结构
5. 总结：
   函数的prototype属性：在定义函数时自动添加的，默认值是一个Object对象
   对象的__proto__属性：创建对象时自动添加的，默认值为构造函数的prototype属性值
   程序员能直接操作显式原型，但不能直接操作隐式原型

    <script>
      // 创建一个函数
      function Fn() { // 内部语句：this.prototype = {}
      }
      console.log(Fn.prototype); //显式原型
      var fn = new Fn(); //this.__proto = Fn.prototype
      console.log(fn.__proto__);
      console.log(Fn.prototype === fn.__proto__); //true
    </script>
1
2
3
4
5
6
7
8
9

原型链

1. 访问一个对象的属性时
   先在自身属性中查找，找到返回
   如果没有找到，再沿着__proto__这条链向上查找，找到返回
   如果最终没有找到，返回undefined
   别名：隐式原型链
   作用：查找对象的属性（方法）
   

2. 构造函数/原型/实体对象的关系

3. 函数的显式原型指向的对象，默认是空Object实例对象（但Object不满足）

4. 所有函数都是Function的实例（包括它本身）

5. Object的原型对象是原型链的尽头

属性问题

1. 读取对象的属性时：会自动到原型链中查找
2. 设置对象的属性值时：不会查找原型链，如果当前对象中没有此属性，直接添加此属性并设置其值
3. 方法一般定义在原型中，属性一般通过构造函数定义在对象本身上

原型面试题

      function A() {}
      A.prototype.n = 1;
      var b = new A();
      A.prototype = {
        n: 2,
        m: 3,
      };

      var c = new A();
      console.log(b.n, b.m, c.n, c.m);  //1,undefined,2,3
1
2
3
4
5
6
7
8
9
10

   var F = function () {};
      Object.prototype.a = function () {
        console.log("a");
      };
      Function.prototype.b = function () {
        console.log("b");
      };
      var f = new F();
      f.a(); //a
      //   f.b(); //f.b is not a function
      F.a(); //a
      F.b(); //b
1
2
3
4
5
6
7
8
9
10
11
12