javascript忍者秘籍第2版

墨蓝 2022-12-23 07:28 129阅读 0赞

console.time(“jj”)

undefined  
console.timeEnd(“jj”)  
VM1738:1 jj: 73327.87915039062 ms  
undefined

babel 转换编译器

## 2 运行时页面的构建过程![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2NzMTgzMzU4MTgxNDA_size_16_color_FFFFFF_t_70_pic_center] ##

浏览器暴露给js引擎的全局对象是window对象。表示一个页面窗口。window对象是获取其他全局对象，变量，浏览器API的访问途径。

只要有没处理完的HTML元素和没执行完的JS代码，将一直执行这两个步骤：1.将HTML构建为DOM 2.执行JS代码  
在浏览器处理完全部HTML元素后，页面构建阶段结束，进入事件处理阶段。

## 2.3 事件处理 ##

所有生成的事件被放入事件列队中，以他们被浏览器检测到的顺序。

检测事件列队头  
如没有检测到事件，则继续检测  
检测到事件，取出事件并执行

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2NzMTgzMzU4MTgxNDA_size_16_color_FFFFFF_t_70_pic_center 1]  
注册事件处理器

*  把函数赋值给属性 .οnclick=  
    不推荐，某个事件只能注册一个事件处理器
 *  addEventLIstener()

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2NzMTgzMzU4MTgxNDA_size_16_color_FFFFFF_t_70_pic_center 2]

# / #

数：定义与参数

### 3.1.2 回调函数 ###

将函数作为参数传入另一个函数，

### 3.2.1 存储函数 ###

存入数组，循环数组遍历去重的方法性能较差  
存入对象的属性

var store={ 
    
    }

### 3.2.2 自记忆函数 ###

能够记住上一次运算的结果。函数计算得到结果时就将该结果按参数存储起来。  
如果另一个调用也使用相同的参数，则可返回上一次存储的结果，而不必重新计算一遍。

### 3.4.1 剩余参数 ###

fu/ction aa(…bb)\{  
console.log(bb)  
\}+  
aa(1,2)

# 4 函数调用 #

隐式函数参数：this,arguments  
this调用函数的上下文对象。

### 4.1.2 this ###

## 4.2 函数调用 ##

函数调用方式对函数代码的执行有很大的影响

4种函数调用的方式

#### 作为函数function直接调用 aa() ####

function aa(){
                function bb(){
    				"use strict"
                    console.log(this)
                }
                bb()
            }

非严格模式下，this是全局上下文window  
严格模式下，undefined

#### 作为一个方法method，关联在一个对象上，实现面向对象编程 nn.aa() ####

该对象会成为函数的上下文

### 作为一个构造函数constrcutor,实例化一个新对象 new aa() ###

function whatMyContext(){ 
    	return this
    }
    function Nn(){ 
    	this.sk=function (){ 
    		return this
    	}
    }
    Nn() 
    let b=new Nn()
    //
    b.sk()===b

通过new关键字调用时会创建一个空对象实例，并作为函数上下文this传给函数。构造函数中在该对象上创建一个sk的属性赋值为一个函数时，该函数成为新创建对象的一个方法。

**构造函数返回值**

*  通过函数的apply,call方法 aa.apply(nn)或aa.call(nn)

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2NzMTgzMzU4MTgxNDA_size_16_color_FFFFFF_t_70_pic_center]: /images/20221120/36572f87940c4b16af795953b37de865.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2NzMTgzMzU4MTgxNDA_size_16_color_FFFFFF_t_70_pic_center 1]: /images/20221120/fb2feea122de460785d1cef754e8e298.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2NzMTgzMzU4MTgxNDA_size_16_color_FFFFFF_t_70_pic_center 2]: /images/20221120/95fee020cf0e4d1abf72decd35cfcd2d.png