Skip to content

Commit bb954d8

Browse files
committed
update
1 parent f5a1b60 commit bb954d8

File tree

1 file changed

+118
-2
lines changed

1 file changed

+118
-2
lines changed

README.md

Lines changed: 118 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
<p align="center"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1498542774866&di=ed28b6b90c4be001acda441377113f2e&imgtype=0&src=http%3A%2F%2F7xkvof.com2.z0.glb.qiniucdn.com%2Farticle%2F79tvzE5PHyLClhki4Gbv.jpg" /></p>
33

44
## JavaScript基础知识剖析
5+
#### 01
56
* [01-01](https://github.com/TYRMars/JSlearn#01-01) `变量类型和计算(1)`
67
* [01-02](https://github.com/TYRMars/JSlearn#01-02) `变量类型和计算(2)`
78
* [01-03](https://github.com/TYRMars/JSlearn#01-03) `变量类型和计算(3)-JSON的理解`
@@ -10,10 +11,12 @@
1011
* [01-06](https://github.com/TYRMars/JSlearn#01-06) `原型链`
1112
* [01-07](https://github.com/TYRMars/JSlearn#01-07) `instanceof`
1213
* [01-08](https://github.com/TYRMars/JSlearn#01-08) `知识点小结 & 解决问题`
14+
#### 02
1315
* [02-01](https://github.com/TYRMars/JSlearn#02-01) `作用域和闭包-执行上下文`
14-
* [02-02](https://github.com/TYRMars/JSlearn#02-01) `作用域和闭包-this`
16+
* [02-02](https://github.com/TYRMars/JSlearn#02-02) `作用域和闭包-this`
1517
* [02-03](https://github.com/TYRMars/JSlearn#02-03) `作用域和闭包-作用域`
1618
* [02-04](https://github.com/TYRMars/JSlearn#02-04) `作用域和闭包-闭包`
19+
* [02-05](https://github.com/TYRMars/JSlearn#02-05) `知识点小结 & 解决问题`
1720

1821

1922
## JS小练习
@@ -527,6 +530,7 @@ function F1() {
527530

528531
## 02-04
529532
### 作用域和闭包-闭包
533+
* 函数作为返回值
530534
```JavaScript
531535
function F1() {
532536
var a = 100;
@@ -540,9 +544,121 @@ var f1 = F1();
540544
var a = 200;
541545
f1();
542546
```
543-
* 函数作为返回值
544547
* 函数作为参数传递
548+
```JavaScript
549+
function F1() {
550+
var a = 100;
551+
return function () {
552+
console.log(a); //自由变量,父作用域中查找
553+
}
554+
}
555+
var f1 = F1();
556+
function F2(fn) {
557+
var a = 200;
558+
fn();
559+
}
560+
F2(f1);
561+
```
562+
## 02-05
563+
### 知识点小结 & 解决问题
564+
#### 对变量提升的理解
565+
* 变量定义
566+
* 函数声明(注意和函数表达式的区别)
567+
#### this几种不停的使用场景
568+
* 作为构造函数执行
569+
* 作为对象属性执行
570+
* 作为普通函数执行
571+
* call apply bind
572+
```JavaScript
573+
function Foo(name){
574+
this.name = name;
575+
}
576+
var f = new Foo('zhangsan');
577+
578+
var obj = {
579+
name:'A',
580+
printName:function(){
581+
console.log(this.name);
582+
}
583+
}
584+
obj.printName()
545585

586+
function fn(){
587+
console.log(this);
588+
}
589+
fn()
590+
591+
// call apply bind
592+
function fn1(name) {
593+
alert(name);
594+
console.log(this);
595+
}
596+
fn1.call({x:100},'zhangsan',20);
597+
// bind
598+
var fn2 = function fn2(name) {
599+
alert(name);
600+
console.log(this);
601+
}.bind({y:200});
602+
fn2('zhangsan',20);
603+
```
604+
#### 创建10个<a>标签 点击的时候弹出来对应的序号
605+
* 错误写法
606+
```JavaScript
607+
//这是一个错误的写法!!!
608+
var i,a;
609+
for (var i = 0; i < 10; i++) {
610+
a = document.createElement('a');
611+
a.innerHTML = i + '<br>';
612+
a.addEventListener('click',function (e) {
613+
e.preventDefault();
614+
alert(i)
615+
})
616+
document.body.appendChild(a);
617+
}
618+
//输出为如下: <a>"9"<br></a>
619+
```
620+
* 正确写法
621+
```JavaScript
622+
//这是一个正确写法!!!
623+
var i;
624+
for (i = 0; i < 10; i++) {
625+
(function(i){
626+
var a = document.createElement('a');
627+
a.innerHTML = i + '<br>';
628+
a.addEventListener('click',function (e) {
629+
e.preventDefault();
630+
alert(i);
631+
})
632+
document.body.appendChild(a);
633+
})(i)
634+
}
635+
```
636+
#### 如何理解作用域
637+
* 自由变量
638+
* 作用域链,即自由变量的查找
639+
* 闭包的两个场景
640+
641+
#### 实际开发中闭包的应用
642+
```JavaScript
643+
//闭包实际应用中主要作用于封装变量,收取权限
644+
function isFirstLoad() {
645+
var _list = [];
646+
return function (id) {
647+
if(_list.indexOf(id) >= 0){
648+
return false;
649+
}else {
650+
_list.push(id);
651+
return true;
652+
}
653+
}
654+
}
655+
656+
// 应用
657+
var firstLoad = isFirstLoad()
658+
firstLoad(10) // true
659+
firstLoad(10) // false;
660+
firstLoad(20) // true
661+
```
546662
---
547663

548664
### JSDemo JS小程序

0 commit comments

Comments
 (0)