Skip to content

Commit fc6d951

Browse files
committed
update
1 parent 0052d3b commit fc6d951

File tree

1 file changed

+76
-4
lines changed

1 file changed

+76
-4
lines changed

README.md

Lines changed: 76 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010
* [01-06](https://github.com/TYRMars/JSlearn#01-06) `原型链`
1111
* [01-07](https://github.com/TYRMars/JSlearn#01-07) `instanceof`
1212
* [01-08](https://github.com/TYRMars/JSlearn#01-08) `知识点小结 & 解决问题`
13+
* [02-01](https://github.com/TYRMars/JSlearn#02-01) `作用域和闭包-执行上下文`
1314

1415

1516
## JS小练习
@@ -290,13 +291,13 @@ f.toString(); // 要去f.__proto__.__proto__中查找
290291

291292
## 01-08
292293
### 知识点小结 & 解决问题
293-
* 如何准确判断一个变量是数组类型
294+
#### 如何准确判断一个变量是数组类型
294295
```JavaScript
295296
var arr = [];
296297
arr instanceof Array; //true
297298
typeof arr //object typeof是无法判断是否是数组
298299
```
299-
* 写一个原型链继承的例子
300+
#### 写一个原型链继承的例子
300301
```JavaScript
301302
//动物
302303
function Animal(){
@@ -317,9 +318,80 @@ var hashiqi = new Dog();
317318
```
318319
* 推荐 阮一峰老师👨‍🏫的两篇文章:[Javascript 面向对象编程(一):封装](http://www.ruanyifeng.com/blog/2010/05/object-oriented_javascript_encapsulation.html)[Javascript继承机制的设计思想](http://www.ruanyifeng.com/blog/2011/06/designing_ideas_of_inheritance_mechanism_in_javascript.html)
319320

320-
* 描述new一个对象的过程
321-
* zepto(或其他框架)源码中如何使用原型链
321+
#### 描述new一个对象的过程
322+
* 创建一个新对象
323+
* this指向这个新对象
324+
* 执行代码,即对this赋值
325+
* 返回this 🔙
326+
```JavaScript
327+
function Foo(name,age){
328+
this.name = name ;
329+
this.age = age ;
330+
//return this //默认有这一行
331+
}
332+
var f = new Foo('zhangsan',20);
333+
//var f1 = new Foo('list',22) //创建多个对象
334+
```
335+
336+
#### zepto(或其他框架)源码中如何使用原型链
337+
* 。。。。。。
338+
339+
#### 贴近实际开发原型链继承的例子
340+
```JavaScript
341+
function Elem(id) {
342+
this.elem = document.getElementById(id);
343+
}
322344

345+
Elem.prototype.html = function (val) {
346+
var elem = this.elem;
347+
if (val) {
348+
elem.innerHTML = val;
349+
return this; // 链式操作
350+
}else {
351+
return elem.innerHTML;
352+
}
353+
}
354+
355+
Elem.prototype.on = function (type, fn) {
356+
var elem = this.elem ;
357+
elem.addEventListener(type, fn) ;
358+
}
359+
360+
var div1 = new Elem('div1');
361+
//console.log(div1.html());
362+
div1.html('<p>hello imooc</p>')
363+
div1.on('click',function () {
364+
alert('click')
365+
})
366+
```
367+
## 02-01
368+
### 作用域和闭包-执行上下文
369+
* 说一下对变量提升的理解
370+
* 说明`this`几种不同的使用场景
371+
* 创建10个`<a>`标签,点击的时候弹出来对应的序号
372+
* 如何理解作用域
373+
* 实际开发中闭包的应用
374+
#### 知识点梳理
375+
* 执行上下文
376+
* this
377+
* 作用域
378+
* 作用域链
379+
* 闭包
380+
#### 执行上下文
381+
```JavaScript
382+
console.log(a); // undefined
383+
var a = 100;
384+
385+
fn('zhangsan') // 'zhangsan' 20
386+
function fn(name) {
387+
age = 20;
388+
console.log(name, age);
389+
var age;
390+
}
391+
```
392+
* 范围:一段<script>或者一个函数
393+
* 全局:变量定义、函数声明
394+
* 函数:变量定义、函数声明、this、arguments
323395

324396
---
325397

0 commit comments

Comments
 (0)