0
点赞
收藏
分享

微信扫一扫

深入学习JavaScript

女侠展昭 2022-07-12 阅读 88

JS高级学习笔记(上)

文章目录

this指向

  1. 函数在调用时,JavaScript会默认给this绑定一个值;
  2. this的绑定和定义的位置(编写的位置)没有关系;
  3. 3.this的绑定和调用方式以及调用的位置有关系;
  4. 4.this是在运行时被绑定的;

默认绑定:

image-20220704135202645

隐式绑定:

在调用位置中,是通过某个对象发起函数的调用

image-20220704153014522

new绑定:

image-20220704154347167

补充:

this面试题的newPerson内存图

this面试题四的newPerson内存图2

显示绑定:

image-20220704154923569

规则优先级

  • new绑定>bind绑定(new绑定和call、apply是不允许同时使用的,所以不存在谁的优先级更高;new绑定可以和bind一起使用,new绑定优先级更高)
  • new绑定>隐式绑定
  • 显示绑定>隐式绑定
  • 默认规则的优先级最低

箭头函数(arrow function):

作用域和作用域链(Scope Chain)

  • 作用域链是一个对象列表,用于变量标识符的求值;
  • 当进入一个执行上下文时,这个作用域链被创建,并且根据代码类型,添加一系列的对象;
image-20220704175917226

关于Map和Array.prototype.map()

关于Map

Map 对象保存键值对,并且能够记住键的原始插入顺序。任何值(对象或者[基本类型)都可以作为一个键或一个值。ObjectMap 类似的是,它们都允许你按键存取一个值、删除键、检测一个键是否绑定了值。

Array.prototype.map()中的的map() 方法创建一个新数组,这个新数组由原数组中的每个元素都调用一次提供的函数后的返回值组成。

闭包

  • 一个普通的函数function,如果它可以访问外层作用域的自由变量,那么这个函数和周围环境就是一个闭包;
  • 从广义的角度来说:JavaScript中的函数都是闭包;
  • 从狭义的角度来说:JavaScript中一个函数,如果访问了外层作用域的变量,那么它是一个闭包;

arguments对象(类数组对象)

事实上在函数有一个特别的对象:arguments对象

  • 默认情况下,arguments对象是所有(非箭头)函数中都可用的局部变量;
  • 该对象中存放着所有的调用者传入的参数,从0位置开始,依次存放;
  • arguments变量的类型是一个object类型( array-like ),不是一个数组,但是和数组的用法看起来很相似;
  • 如果调用者传入的参数多余函数接收的参数,可以通过arguments去获取所有的参数

Argument转Array

方式一:遍历arguments,添加到一个新数组中

image-20220703164141016

方式二:ES6中常用的两个方法:

image-20220703164345309

函数的剩余(rest)参数

如果最后一个参数是 … 为前缀的,那么它会将剩余的参数放到该参数中,并且作为一个数组;

那么剩余参数和arguments有什么区别呢?

  • 剩余参数只包含那些没有对应形参的实参,而 arguments 对象包含了传给函数的所有实参;
  • arguments对象不是一个真正的数组,而rest参数是一个真正的数组,可以进行数组的所有操作;
  • arguments是早期的ECMAScript中为了方便去获取所有的参数提供的一个数据结构,而rest参数是ES6中提供并且希望以此 来替代arguments的;

纯函数

在程序设计中,若一个函数符合以下条件,那么这个函数被称为纯函数(维基百科):

  • 此函数在相同的输入值时,需产生相同的输出。
  • 函数的输出和输入值以外的其他隐藏信息或状态无关,也和由I/O设备产生的外部输出无关。
  • 该函数不能有语义上可观察的函数副作用,诸如“触发事件”,使输出设备输出,或更改输出值以外物件的内容等。

柯里化(curring)

只传递给函数一部分参数来调用它,让它返回一个函数去处理剩余的参数,这个过程就称之为柯里化;

image-20220704102917372

image-20220704103248761

对象和函数的原型

对象的原型

JavaScript当中每个对象都有一个特殊的内置属性 [[prototype]],这个特殊的对象可以指向另外一个对象。获取方式有两张:

  1. 通过对象的 proto 属性可以获取到(但是这个是早期浏览器自己添加的,存在一定的兼容性问题);
  2. 通过 Object.getPrototypeOf 方法可以获取到;

函数的原型(prototype)

注意: 所有的函数都有一个prototype的属性(不是__proto__)。因为它是一个函数,所有拥有了prototype属性,obj就没有这个属性。

image-20220706181830563

image-20220706190655095

重写原型对象

每创建一个函数, 就会同时创建它的prototype对象, 这个对象也会自动获取constructor属性;

如果我们重写整个原型对象,相当于给prototype重新赋值了一个对象, 那么这个新对象的constructor属性, 会指向Object构造函数, 而不是原本的构造函数。

面向对象的特性 – 继承(ES5)

通过原型链实现方法的继承(ES5)

image-20220707155015763

借用构造函数实现属性的继承(ES5)

在子类型构造函数的内部调用父类型构造函数:

  • 因为函数可以在任意的时刻被调用;
  • 因此通过apply()和call()方法也可以在新创建的对象上执行构造函数

image-20220707160317458

寄生式继承函数(ES5)

核心:创建一个对象,使子类显示原型指向这个对象,并且对象的隐式原型指向父类的显示原型

image-20220707163627735

构造函数的类方法

类方法:指直接添加在构造函数的对象本身的方法

实例方法:是指添加在构造函数的对象原型上的方法

2022.07.07

举报

相关推荐

0 条评论