这段时间看了《你不知道的JavaScript》上卷,对很多知识有了重新的认识,所以在这里罗列一些知识点作为巩固。 

作用域和闭包

词法作用域
  • 变量赋值操作会执行的两个动作

  答:编译器会在当前作用域中声明一个变量,前提是之前没有声明过。运行时引擎会在内存中查找该变量然后为它赋值。

  • RHS 和 LHS 查询

  答:查找容器用LHS查找,查找相应值用RHS查找

  • 在作用域顶层无法找到目标变量,在严格模式和非严格模式下有什么结果?

  答:非严格模式会创建一个全局变量,严格模式不会并且会报错。

  • with的副作用

  答:将变量泄露到全局上

 function foo( obj ) {
with( obj ) {
a = 2;
}
}
var obj = { b: 3 };
foo( obj );
console.log( obj.a ); // undefined
console.log( a ); // 2 -------> a泄露到了全局上
  • 匿名函数的三个缺点

  答:1、不利于调试

    2、降低可读性

    3、在递归时容易出错,由于递归是调用自身,匿名函数无法用函数名调用自身。

  • IIFE是什么

  答:自执行函数,有两种形式:

 (function(xx) {...})();
(function(xx) {...}());
  • JS的块作用域以及如何隐式模拟块作用域?

  答:js没有强类型语言那样的块作用域,可以用let声明变量达到块作用域实现的效果。

  • let 和 var 在变量声明有什么区别?

  答:let声明的变量不会提升,var会。

  • 提升(变量、函数有什么区别)

  答:函数比变量更早提升。

闭包
  • 闭包产生的原理
 function foo() {
function bar() {};
/*...*/
}
        当函数可以记住并且访问所在的词法作用域时,就产生了闭包,即使函数是在当前词法作用域之外执行。
         bar对foo内部作用域的引用就叫做闭包。
  • 闭包遇上for循环,问题、机制、解决办法(考虑let)

  答:详情参见我前面关于闭包的博客。

  • 模块的两个必要条件

  答:1、要有一个外部嵌套函数。

    2、封闭函数必须返回至少一个内部函数。

  • import 和 module 的区别

  答:import会导入模块中的一个或多个API分别绑定在一个变量上,module将整个模块的API导入并绑定到一个变量上。

this和对象原型

this
  • 胖箭头 => 的作用原理

  答:用当前词法作用域覆盖了this本来的值。

  • this是运行时绑定还是编译时绑定?

  答:运行时。

  • this的四个绑定及其原理

  答:1、默认绑定:默认绑定全局变量window。

    2、隐式绑定

    3、显式绑定:使用call()、apply()

    4、new绑定:函数创建对象时用new

  • 绑定的优先级

  答:new、显式 > 隐式 > 默认

  • 为什么setTimeout()中的this会默认绑定到window?

  答:setTimeout是一个定义在全局中的函数,所以该函数的this默认为window。

  • 写一个硬绑定bind(obj, target);
 function bind(fn, target) {
return function() {
return fn.apply(target, arguments);
};
}
  • 硬绑定的优势

  答:任由外部如何变动,内部的this绑定对象不会改变。

  • 使用new调用函数时会发生的四个步骤?

  答:1、创建一个全新的对象。

    2、对这个新对象执行[prototype]链接。
    3、这个新对象会被绑定到函数调用的this。

    4、如果函数没有返回值,那么new表达式中的函数调用会自动返回这个新对象,否则返回函数返回值。

对象
  • js中的六个基本类型、六个内置对象

  答:六个基本类型:null、string、number、boolean、undefined、object

    六个内置对象:String、Number、Boolean、Object、Function、Array

  • 函数从来不会属于某一个对象
  • 对象中内置的get函数的函数名和函数值分别代表什么?

  答:函数名------->对象属性名,函数值------->对象属性值

  • in 和 hasOwnPrototype 的区别

  答:in会在对象中以及原型链中查找对象是否含有该属性,而hasOwnPrototype只会在该对象中查找。

  • for...in 的特点?为什么说数组的遍历尽量不用 for...in?

  答:会遍历对象所有可枚举的属性,并且不一定按照顺序遍历。

  • 类的继承其实就是复制,js不能复制
  • 隐式混入和显式混入的区别

  答:前者直接全部“复制”过来,后者用call、apply

原型
  • 原型链上存在隐式屏蔽 
  • Foo.prototype的 .constructor 属性是一直存在的吗?

  答:不是,它是默认的。当你的prototype对象改变了,这个属性就不存在了除非你手动添加。

  • var b = Object.create(a);的作用机制

  答:创建一个对象b并关联到a。

行为委托
  • 一句话概括

  答:函数的继承,对象的委托

  • 委托的两个原则

  答:1、状态保存在委托者,而不是委托目标。

    2、避免在[prototype]链上的不同位置使用相同的命名

  • 委托的实质?

  答:某些对象找不到方法或者属性的引用时可以把请求委托给另一个对象。

  • 根据下面函数继承写出相应的行为委托
    函数继承:
 function A(name) {
this.name = name;
}
A.prototype.sayName = function() {
console.log(this.name);
};
function B(name) {
A.call(this, name);
}
B.prototype = Object.create(A.prototype);
var b = new B('Nic');
b.sayName(); //Nic
    行为委托:
 var A = {
init: function(name) { this.name = name; },
sayName: function() { console.log(this.name); }
};
var B = Object.create(A);
B.init('Nic');
B.sayName() //Nic
怎么改变的:
  • 将函数封装对象
    • 将构造函数内部的变量定义封装成一个函数
    • 将prototype对象的函数逐一封装进该对象
  • 将两个对象关联
    • 此时没有继承的说法了,关联不是上下级的关系,而是任意的
    • 关联后可以自定义或者封装新对象的一些属性及方法
  • 注意:尽量避免暴露委托
class
  • class不能声明属性只能声明方法
 class A {
constructor(name, age) {
this.name = name;
this.age = age;
}
sayName() {
console.log('hello, my name is: '+this.name);
}
}
var a = new A('wind', 20);
a.sayName(); //hello, my name is: wind

API设计原则

  • 最小特权原则:最小限度的暴露必要内容,而将其他内容都“隐藏”起来(将变量声明在某个作用域内尽量不在全局作用域中)
  • 尽量避免匿名函数
  • 关联关系中尽量避免函数名重复,会引发屏蔽覆盖的副作用
  • 内部委托(在内部调用)比直接委托(直接使用)可以让API接口更加清晰
  • 委托最好在内部实现,不要轻易的暴露出去

《你不知道的JavaScript-上卷》笔记的更多相关文章

  1. HTML+CSS笔记 CSS笔记集合

    HTML+CSS笔记 表格,超链接,图片,表单 涉及内容:表格,超链接,图片,表单 HTML+CSS笔记 CSS入门 涉及内容:简介,优势,语法说明,代码注释,CSS样式位置,不同样式优先级,选择器, ...

  2. CSS笔记--选择器

    CSS笔记--选择器 mate的使用 <meta charset="UTF-8"> <title>Document</title> <me ...

  3. HTML+CSS笔记 CSS中级 一些小技巧

    水平居中 行内元素的水平居中 </a></li> <li><a href="#">2</a></li> &l ...

  4. HTML+CSS笔记 CSS中级 颜色&长度值

    颜色值 在网页中的颜色设置是非常重要,有字体颜色(color).背景颜色(background-color).边框颜色(border)等,设置颜色的方法也有很多种: 1.英文命令颜色 语法: p{co ...

  5. HTML+CSS笔记 CSS中级 缩写入门

    盒子模型代码简写 回忆盒模型时外边距(margin).内边距(padding)和边框(border)设置上下左右四个方向的边距是按照顺时针方向设置的:上右下左. 语法: margin:10px 15p ...

  6. HTML+CSS笔记 CSS进阶再续

    CSS的布局模型 清楚了CSS 盒模型的基本概念. 盒模型类型, 我们就可以深入探讨网页布局的基本模型了.布局模型与盒模型一样都是 CSS 最基本. 最核心的概念. 但布局模型是建立在盒模型基础之上, ...

  7. HTML+CSS笔记 CSS进阶续集

    元素分类 在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素.内联元素(又叫行内元素)和内联块状元素. 常用的块状元素有: <div>.<p>.<h1&g ...

  8. HTML+CSS笔记 CSS进阶

    文字排版 字体 我们可以使用css样式为网页中的文字设置字体.字号.颜色等样式属性. 语法: body{font-family:"宋体";} 这里注意不要设置不常用的字体,因为如果 ...

  9. HTML+CSS笔记 CSS入门续集

    继承 CSS的某些样式是具有继承性的,那么什么是继承呢?继承是一种规则,它允许样式不仅应用于某个特定html标签元素,而且应用于其后代(标签). 语法: p{color:red;} <p> ...

  10. HTML+CSS笔记 CSS入门

    简介: </span>年的圣诞节期间,吉多·范罗苏姆为了在阿姆斯特丹打发时间,决心开发一个新的<span>脚本解释程序</span>,作为ABC语言的一种继承. & ...

随机推荐

  1. 贪心--cf、education62-C

    cf-Education 62-C 题目 C. Playlist time limit per test 2 seconds memory limit per test 256 megabytes i ...

  2. 【Eclipse】编译使用Makefile的C工程

    创建MakeFile project新建src文件夹,将文件复制到里面.右击makefile,make targets->create->名称填上allmake targets->b ...

  3. JavaScript数据结构-5.队列

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. 使用vue的v-model自定义 checkbox组件

    <template id='c'> <input type="checkbox" :checked="checked" v-on:change ...

  5. 关于禁止html缓存

    在现代的浏览器里,为了增强用户体验,浏览器一般都会把网页上所需的静态文件缓存到本地,再次刷新的时候则无需再重新加载,但是我们有时候就是不需要浏览器缓存这些文件,而是每次都从服务器端读取数据,可以用以下 ...

  6. mysql修改root密码和对连接授权

    mysql修改root密码 首先 mysql -uroot -p 进入mysql界面后执行 set password for root@localhost = password('111111');  ...

  7. [PY3]——内置数据结构(3)——字符串及其常用操作

    字符串及其常用操作xmind图 字符串的定义 1. 单引号/双引号 In [1]: s1='hello world' In [2]: s1="hello world" 2. 三对单 ...

  8. nodejs学习笔记一( sublime、atom开发环境,http模块,fs模块的初识)

    http服务   let server = http.createServer(function(req,res){       });   监听: server.listen(8080);   re ...

  9. REDIS与MEMCACHED的区别 8大点

    如果简单地比较Redis与Memcached的区别,大多数都会得到以下观点:1 Redis不仅仅支持简单的k/v类型的数据,同时还提供list,set,hash等数据结构的存储.2 Redis支持数据 ...

  10. Spring注解_详解

    @Autowired 注释 将 @Autowired 注释标注在成员变量上   import org.springframework.beans.factory.annotation.Autowire ...