首页 / JAVASCRIPT / 《你不知道的javascript·上》笔记

《你不知道的javascript·上》笔记

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了《你不知道的javascript·上》笔记，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含4657字，纯文字阅读大概需要7分钟。

内容图文

作用域是什么

编译原理

  • 分词/词法分析

    • 这个过程会将由字符组成的字符串分解成（对编程语言来说）有意义的代码块，这些代码块被称为词法单元

  • 解析/语法分析

    • 词法单元流（数组）转换成一个由元素逐级嵌套所组成的代表了程序语法结构的树(抽象语法树AST)

  • 代码生成

    • 将AST转换为可执行代码的过程称被称为代码生成

理解作用域

  • 处理成员

    • 引擎——负责代码编译和执行

    • 编译器——词法-语法-代码生成

    • 作用域——根据名称查找变量的一套规则

  • 引擎查询(代码执行前)

    • 一个赋值操作的LHS(左侧)和RHS(右侧)查询

      var a = 0       LHS-a，RHS-0
console.log(a)  LHS-无，RHS-log和a

    • 如果查找的目的是对变量进行赋值，就会使用LHS查询

    • 如果查找的目的是获取变量的值，就会使用RHS查询

词法作用域

词法阶段

  • 定义在词法阶段的作用域，由你在写代码时将变量和块作用域写在哪里来决定的，执行时不变，因此该词法作用域属于静态作用域(相对于动态作用域)

  • 无论函数在哪里被调用，也无论它如何被调用，它的词法作用域都只由函数被创建时所处的位置决定

  • 词法作用域是在写代码或者说定义时确定的，而动态作用域是在运行时确定的(javascript的this也是)

  • 词法作用域关注函数在何处声明，而动态作用域关注函数从何处调用

欺骗词法

  • eval——修改词法

  • with——创建词法

  • 性能

    • 处于运行时才确定的eval和with的使用会导致代码运行变慢

    • 引擎无法在编译时对其作用域查找进行优化，因此只能谨慎地认为这样的优化是无效的

函数作用域和块作用域

块作用域

  • with：用with从对象中创建出的作用域仅在with声明中而非外部作用域中有效

  • try/catch：try/catch的catch分句会创建一个块作用域，其中声明的变量仅在catch内部有效(性能糟糕）

  • ps:任何声明在某个作用域内的变量，都将附属于这个作用域

提升

  • js引擎会将"var a = 2"当作两个单独的声明

    • 第一个是编译阶段的任务(var a=undefined)

    • 第二个则是执行阶段的任务(a=2)

作用域闭包

  • 在自身的作用域外被调用并使得作用域和活动对象被保存的现象

  • 无论通过何种手段将内部函数传递到所在的词法作用域以外，它都会持有对原始定义作用域的引用

  • es6中模块文件中的内容会被当作好像包含在作用域闭包中一样来处理

关于this

  • this是在运行时进行绑定的，并不是在编写时绑定，它的上下文取决于函数调用时的各种条件

this全面解析

绑定规则

  • 默认绑定，隐式绑定，显式绑定和new绑定

优先级

  • new绑定 => 显示绑定 => 隐式绑定 => 默认绑定

bind函数

  • 用于改变作用域和传入预定参数(柯里化的一种)

对象

浅拷贝

Object.assign(目标对象，源对象..)

属性描述符

    writable                            // 是否可写
    enumerable                          // 是否可枚举
    configurable                        // 是否可配置
        Object.preventExtensions()      // 不能增加&&不能修改       
        Object.seal()                   // 不能增加&&不能修改&&不能配置&&不能删除
        Object.freeze()                 // 不能增加&&不能修改&&不能配置&&不能删除&&不能访问&&不能遍历

    ps:特性值操作只会影响对象的直接属性，不会影响其引用对象的属性

访问描述符

  • 当使用getter和setter时，会忽略对象的value和writable特性

存在性

  • 判断对象中是否存在对应的属性
    ````
    'key' in obj // 方法一

    Object.prototype.hasOwnProperty.call(对象,属性名) // 方法二
    ````

遍历

  • 对象

    • for..in——进行对象遍历的时候，因游览器差异，顺序是不可靠的

  • 数组

    • for..of——通过调用迭代器对象，然后调用迭代器对象的next()方法进行遍历
      // 数组有内置的@@iterator ，因此for..of可以直接应用在数组上
  // 数组的迭代器对象通过"arr[Symbol.iterator]()"进行获取 
  // 对象进行for..of操作的变通方法

  for (var key of Object.keys(someObject)) {
      console.log(someObject[key]);
  }

混合对象"类"

  • 类意味着复制

  • 传统的类被实例化时，它的行为会被复制到实例中;类被继承时，行为也会被复制到子类中

  • 多态——在继承链的不同层次名称相同但是功能不同的函数
    • 看起来似乎是从子类引用父类，但是本质上引用的其实是复制的结果

  • JavaScript也有类似的语法，但是和其他语言中的类完全不同;JavaScript 并不会(像类那样)自动创建对象的副本

  • 混入模式（显式/隐式）可以用来模拟类的复制行为，但是通常会产生丑陋并且脆弱的语法，比如显式伪多态(OtherObj.methodName.call(this,...))，这会让代码更加难懂并且难以维护

原型

Prototype

  • 如果原型链父级的属性被设置为只读，则实例对象无法创建屏蔽属性 （通过Object.defineProperty()可以）

  • 如果原型链父级的属性被设为setter属性，则实例对象的赋值和更改操作都会自动延用原型链上的setter属性，体现为
    实例属性本身的赋值或更改无效，除非setter属性方法下存在赋值操作 （通过Object.defineProperty()可以）

原型继承

  • 真正的类继承是会进行对象复制的，但是javascript的继承本质是原型委托，通过原型来进行对象的关联

  • Object.setPrototypeOf(对象，被继承的原型)

行为委托

对象关联·行为委托

  • 行为委托认为对象之间是兄弟关系，互相委托，而不是父类和子类的关系

  • 通过在两个对象之间使用Object.create(对象)来实现行为委托，这种模式只需要两个实体，而且可以互为关联

  • 只需要集中在对象之间的关联关系，可以更好地支持关注分离原则，创建和初始化并不需要合并为一个步骤(相比new 函数)

  • 除了能让代码看起来更简洁，更具扩展性外，还可以简化代码结构

    var Foo = { /* .. */ };         // 父类
var Bar = Object.create( Foo ); // 继承父类
Bar.fn=fnA;                     // 书写子类
var b1 = Object.create( Bar );  // 获取子类实例

内省检测·检查“类”关系

  • 方法1 => A.isPrototypeOf(b)
  • 方法2 => Object.getPrototypeOf(a)===A.prototype
  • 方法3 => a.__proto__=== A.prototype
  • 方法4 => a instansof A

内容总结

以上是互联网集市为您收集整理的《你不知道的javascript·上》笔记全部内容，希望文章能够帮你解决《你不知道的javascript·上》笔记所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/645307.html

来源：【匿名】