add files
This commit is contained in:
		
							parent
							
								
									d12e94f797
								
							
						
					
					
						commit
						de04dd0107
					
				| @ -293,10 +293,47 @@ foo: | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| ## arguments | ||||
| 
 | ||||
| 在调用函数时,浏览器每次都会传递进两个隐含的参数: | ||||
| 
 | ||||
| - 1.函数的上下文对象 this | ||||
| 
 | ||||
| - 2.**封装实参的对象** arguments | ||||
| 
 | ||||
| 例如: | ||||
| 
 | ||||
| ```javascript | ||||
|         function foo() { | ||||
|             console.log(arguments); | ||||
|             console.log(typeof arguments); | ||||
|         } | ||||
| 
 | ||||
|         foo(); | ||||
| ``` | ||||
| 
 | ||||
| 
 | ||||
| 20180315_0903.png | ||||
| 
 | ||||
| arguments是一个类数组对象,它也可以通过索引来操作数据,也可以获取长度。 | ||||
| 
 | ||||
| 在调用函数时,我们所传递的实参都会在arguments中保存。 | ||||
| 
 | ||||
| arguments.length可以用来获取**实参的长度**。 | ||||
| 
 | ||||
| 我们即使不定义形参,也可以通过arguments来使用实参(只不过比较麻烦):arguments[0] 表示第一个实参、arguments[1] 表示第二个实参... | ||||
| 
 | ||||
| 
 | ||||
| arguments里边有一个属性叫做callee,这个属性对应一个函数对象,就是当前正在指向的函数的对象。 | ||||
| 
 | ||||
| ```javascript | ||||
| 		function fun() { | ||||
| 
 | ||||
| 			console.log(arguments.callee == fun); //打印结果为true | ||||
| 		} | ||||
| 
 | ||||
| 		fun("hello"); | ||||
| ``` | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
|  | ||||
| @ -1,16 +0,0 @@ | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 参考链接: | ||||
| 
 | ||||
| - <https://www.jianshu.com/p/56a9c2d11adc> | ||||
| 
 | ||||
| - <https://github.com/lin-xin/blog/issues/7> | ||||
| 
 | ||||
| - <https://segmentfault.com/a/1190000007402815> | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| @ -191,6 +191,8 @@ | ||||
| 
 | ||||
| 在函数作用域中可以访问到全局作用域的变量,在全局作用域中无法访问到函数作用域的变量。 | ||||
| 
 | ||||
| **租用与的上下级关系:** | ||||
| 
 | ||||
| 当在函数作用域操作一个变量时,它会先在自身作用域中寻找,如果有就直接使用(**就近原则**)。如果没有则向上一级作用域中寻找,直到找到全局作用域;如果全局作用域中依然没有找到,则会报错ReferenceError。 | ||||
| 
 | ||||
| 
 | ||||
| @ -243,6 +245,52 @@ | ||||
| 
 | ||||
| ## this | ||||
| 
 | ||||
| 解析器在调用函数每次都会向函数内部传递进一个隐含的参数,这个隐含的参数就是this,this指向的是一个对象,这个对象我们称为函数执行的 上下文对象。 | ||||
| 
 | ||||
| 根据函数的调用方式的不同,this会指向不同的对象:【重要】 | ||||
| 
 | ||||
| - 1.以函数的形式调用时,this永远都是window。比如`fun();`相当于`window.fun();` | ||||
| 
 | ||||
| - 2.以方法的形式调用时,this是调用方法的那个对象 | ||||
| 
 | ||||
| - 3.以构造函数的形式调用时,this是新创建的那个对象 | ||||
| 
 | ||||
| - 4.使用call和apply调用时,this是指定的那个对象 | ||||
| 
 | ||||
| 针对第1和第2条的举例: | ||||
| 
 | ||||
| ```javascript | ||||
|         function fun() { | ||||
|             console.log(this.name); | ||||
|         } | ||||
| 
 | ||||
| 
 | ||||
|         var obj1 = { | ||||
|             name: "smyh", | ||||
|             sayName: fun | ||||
|         }; | ||||
| 
 | ||||
|         var obj2 = { | ||||
|             name: "vae", | ||||
|             sayName: fun | ||||
|         }; | ||||
| 
 | ||||
|         var name = "全局的name属性"; | ||||
|         //obj.sayName(); | ||||
|         //以函数形式调用,this是window | ||||
|         //fun();       //可以理解成 window.fun() | ||||
| 
 | ||||
|         //以方法的形式调用,this是调用方法的对象 | ||||
|         obj2.sayName(); | ||||
| 
 | ||||
| ``` | ||||
| 
 | ||||
| 
 | ||||
| 打印结果:`vae`。 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| @ -267,4 +315,98 @@ | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| ```javascript | ||||
| 
 | ||||
| 
 | ||||
| ``` | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| ```javascript | ||||
| 
 | ||||
| 
 | ||||
| ``` | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| ```javascript | ||||
| 
 | ||||
| 
 | ||||
| ``` | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| ```javascript | ||||
| 
 | ||||
| 
 | ||||
| ``` | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| ```javascript | ||||
| 
 | ||||
| 
 | ||||
| ``` | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| ```javascript | ||||
| 
 | ||||
| 
 | ||||
| ``` | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| ```javascript | ||||
| 
 | ||||
| 
 | ||||
| ``` | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
|  | ||||
							
								
								
									
										19
									
								
								03-JavaScript/08-构造函数和原型.md
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										19
									
								
								03-JavaScript/08-构造函数和原型.md
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,19 @@ | ||||
| 
 | ||||
| 
 | ||||
| ## new一个构造函数的过程 | ||||
| 
 | ||||
| - 1.开辟对内存空间,创建一个新的对象 | ||||
| 
 | ||||
| - 2.**把this设置为当前对象** | ||||
| 
 | ||||
| - 3.执行内部代码,设置对象属性和方法 | ||||
| 
 | ||||
| - 4.返回新创建的对象 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| ## 原型对象 | ||||
| 
 | ||||
| 引入: | ||||
| 
 | ||||
| 如果我们在 | ||||
							
								
								
									
										124
									
								
								11-JavaScript/07-call、apply、bind的区别.md
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										124
									
								
								11-JavaScript/07-call、apply、bind的区别.md
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,124 @@ | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| ## call()和apply() | ||||
| 
 | ||||
| 
 | ||||
| 这两个方法都是函数对象的方法,需要通过函数对象来调用。 | ||||
| 
 | ||||
| 当函数调用call()和apply()时,函数都会立即**执行**。 | ||||
| 
 | ||||
| 
 | ||||
| - 都是用来改变函数的this对象的指向的。 | ||||
| 
 | ||||
| - 第一个参数都是this要指向的对象(函数执行时,this将指向这个对象)。 | ||||
| 
 | ||||
| - 都可以利用后续参数传实参。 | ||||
| 
 | ||||
| 
 | ||||
| **call()和apply()的区别:** | ||||
| 
 | ||||
| 
 | ||||
| - call()方法可以将实参在对象之后依次传递。 | ||||
| 
 | ||||
| - apply()方法需要将实参封装到一个**数组**中统一传递。 | ||||
| 
 | ||||
| 比如针对下面这样的代码: | ||||
| 
 | ||||
| ```javascript | ||||
|     var persion1 = { | ||||
|         name: "小王", | ||||
|         gender: "男", | ||||
|         age: 24, | ||||
|         say: function (school, grade) { | ||||
|             alert(this.name + " , " + this.gender + " ,今年" + this.age + " ,在" + school + "上" + grade); | ||||
|         } | ||||
|     } | ||||
|     var person2 = { | ||||
|         name: "小红", | ||||
|         gender: "女", | ||||
|         age: 18 | ||||
|     } | ||||
| ``` | ||||
| 
 | ||||
| 
 | ||||
| 如果是通过call的参数进行传参,是这样的: | ||||
| 
 | ||||
| 
 | ||||
| ```javascript | ||||
| 	persion1.say.call(persion2, "实验小学", "六年级"); | ||||
| ``` | ||||
| 
 | ||||
| 
 | ||||
| 如果是通过apply的参数进行传参,是这样的: | ||||
| 
 | ||||
| ```javascript | ||||
| 	persion1.say.apply(persion2, ["实验小学", "六年级"]); | ||||
| ``` | ||||
| 
 | ||||
| 看到区别了吗,call后面的实参与say方法中是一一对应的,而apply传实参时,要封装成一个数组,数组中的元素是和say方法中一一对应的,这就是两者最大的区别。 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| **this的情况:**【非常重要】 | ||||
| 
 | ||||
| 
 | ||||
| - 1.以函数形式调用时,this永远都是window | ||||
| 
 | ||||
| - 2.以方法的形式调用时,this是调用方法的对象 | ||||
| 
 | ||||
| - 3.以构造函数的形式调用时,this是新创建的对象 | ||||
| 
 | ||||
| - 4.使用call和apply调用时,this是指定的对象 | ||||
| 
 | ||||
| 
 | ||||
| ## call()和apply()的作用 | ||||
| 
 | ||||
| - 改变this的指向 | ||||
| 
 | ||||
| - 实现继承。Father.call(this) | ||||
| 
 | ||||
| 
 | ||||
| ## 参数的传递 | ||||
| 
 | ||||
| 1、使用call的时候,thisObj不传或者为null、undefined时,函数中的this会指向window对象。 | ||||
| 
 | ||||
| 2、传递一个别的函数名时,函数中的this将指向这个**函数的引用**。 | ||||
| 
 | ||||
| 3、传递的值为数字、布尔值、字符串,this会指向这些基本类型的包装对象Number、Boolean、String。 | ||||
| 
 | ||||
| 4、传递一个对象,函数中的this则指向传递的这个对象。 | ||||
| 
 | ||||
| 
 | ||||
| ## bind() | ||||
| 
 | ||||
| call和apply都是对函数的直接调用,而bind方法返回的仍然是一个函数,因此后面还需要()来进行调用才可以。 | ||||
| 
 | ||||
| bind与call和apply的不同点在于:call或apply会自动执行对应的函数,bind不会执行对应的函数。 | ||||
| 
 | ||||
| 推荐链接: | ||||
| 
 | ||||
| - | ||||
| 
 | ||||
| 
 | ||||
| 参考链接: | ||||
| 
 | ||||
| - <https://www.jianshu.com/p/56a9c2d11adc> | ||||
| 
 | ||||
| - <https://github.com/lin-xin/blog/issues/7> | ||||
| 
 | ||||
| - <https://segmentfault.com/a/1190000007402815> | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| - [JS中改变this指向的方法](http://www.xiaoxiaohan.com/js/38.html) | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
							
								
								
									
										69
									
								
								11-JavaScript/this.md
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										69
									
								
								11-JavaScript/this.md
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,69 @@ | ||||
| 
 | ||||
| ## this | ||||
| 
 | ||||
| ### this的作用 | ||||
| 
 | ||||
| - this可以帮我们简化很多代码。比如`xiaoming.name`、`xiaoming.age`可以直接写成`this.name`、`this.age`。 | ||||
| 
 | ||||
| - 特别是当我们不知道一个对象是什么,或者这个对象没有名字但又很想调用它的时候,就会使用到this对象。 | ||||
| 
 | ||||
| 举例: | ||||
| 
 | ||||
| - 遍历DOM对象,绑定click事件,调用当前点击的对象的id,而不是所有对象的id。 | ||||
| 
 | ||||
| 
 | ||||
| ### 全局作用域中的this | ||||
| 
 | ||||
| 当一段代码在浏览器中执行时,所有的全局变量和对象都是在window对象上定义的。换而言之,所有的全局变量和对象都属于window对象。 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| ### this的定律 | ||||
| 
 | ||||
| 
 | ||||
| this关键字永远指向函数(方法)运行时的**所有者**。 | ||||
| 
 | ||||
| 
 | ||||
| ### 函数赋值给变量时,this指向window | ||||
| 
 | ||||
| 
 | ||||
| 比如: | ||||
| 
 | ||||
| ``` | ||||
| var foo1 = args.getInfo; | ||||
| foo1(); | ||||
| 
 | ||||
| var foo2 = function(){}; | ||||
| foo2(); | ||||
| ``` | ||||
| 
 | ||||
| 
 | ||||
| this都是指向window。 | ||||
| 
 | ||||
| ### 以函数形式调用时,this永远都是window | ||||
| 
 | ||||
| 
 | ||||
| ### 以方法的形式调用时,this是调用方法的对象 | ||||
| 
 | ||||
| 
 | ||||
| ### 解决闭包中的this指向问题 | ||||
| 
 | ||||
| 
 | ||||
| 内部函数是可以访问到外部函数的变量的。 | ||||
| 
 | ||||
| 方式一:直接通过父函数的名字访问 | ||||
| 
 | ||||
| 方式二:如果不知道父函数的名字,在父函数里加一句`_this = this`,此时`_this`相当于父函数的名字。 | ||||
| 
 | ||||
| ### 当this遇到一些特殊的函数时 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
							
								
								
									
										94
									
								
								11-JavaScript/严格模式.md
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										94
									
								
								11-JavaScript/严格模式.md
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,94 @@ | ||||
| 
 | ||||
| 
 | ||||
| ## 严格模式 | ||||
| 
 | ||||
| - 针对脚本文件:将`use strict`放在脚本文件的第一行,则整个脚本文件将以严格模式运行。 | ||||
| 
 | ||||
| 
 | ||||
| - 针对单个函数:将`use strict`放在函数体的第一行,则整个函数以严格模式运行。 | ||||
| 
 | ||||
| 
 | ||||
| 脚本文件的变通写法:因为第一种调用方法不利于文件合并,所以更好的做法是,借用第二种方法,将整个脚本文件放在一个立即执行的匿名函数之中。 | ||||
| 
 | ||||
| 
 | ||||
| ## 严格模式和普通模式的区别 | ||||
| 
 | ||||
| ### 1、全局变量显式声明 | ||||
| 
 | ||||
| 在正常模式中,如果一个变量没有声明就赋值,默认是全局变量。严格模式禁止这种用法,全局变量必须显式声明。 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| ### 2、禁止使用with语句 | ||||
| 
 | ||||
| 因为with语句无法在编译时就确定,属性到底归属哪个对象。 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| ### 3、创设eval作用域 | ||||
| 
 | ||||
| 
 | ||||
| ### 4、禁止this关键字指向全局对象: | ||||
| 
 | ||||
| ```javascript | ||||
|         var foo = function () { | ||||
|             console.log(this); | ||||
|         } | ||||
| 
 | ||||
|         foo(); | ||||
| ``` | ||||
| 上方代码中,普通模式打印的是window。严格模式下打印的是undefined。 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| ### 构造函数必须通过new实例化对象 | ||||
| 
 | ||||
| 构造函数必须通过new实例化对象,否则报错。因为this为undefined,此时无法设置属性。 | ||||
| 
 | ||||
| 比如说: | ||||
| 
 | ||||
| 
 | ||||
| ``` | ||||
|         var Cat = function (name) { | ||||
|             this.name = name; | ||||
|         } | ||||
| 
 | ||||
|         Cat('haha'); | ||||
| ``` | ||||
| 
 | ||||
| 上方代码中,如果在严格模式下,则会报错。 | ||||
| 
 | ||||
| 
 | ||||
| ### 5、为了让代码更安全,禁止函数内部遍历调用栈 | ||||
| 
 | ||||
| ### 6、严格模式下无法删除变量 | ||||
| 
 | ||||
| 
 | ||||
| ### 7~10 属性相关 | ||||
| 
 | ||||
| 普通模式下,对一个对象的只读属性进行赋值,不会报错,只会默默地失败。严格模式下,将报错。 | ||||
| 
 | ||||
| 严格模式下,对禁止扩展的对象添加新属性,会报错。 | ||||
| 
 | ||||
| 普通模式下,如果对象有多个重名属性,最后赋值的那个属性会覆盖前面的值。严格模式下,这属于语法错误。 | ||||
| 
 | ||||
| 普通模式下,如果函数有多个重名的参数,可以用arguments[i]读取。严格模式下,多个重名的参数属于语法错误。 | ||||
| 
 | ||||
| 
 | ||||
| ### 函数必须声明在顶层 | ||||
| 
 | ||||
| 
 | ||||
| 将来Javascript的新版本会引入"块级作用域"。为了与新版本接轨,严格模式只允许在全局作用域或函数作用域的顶层声明函数。也就是说,不允许在非函数的代码块内声明函数。 | ||||
| 
 | ||||
| ### 新增关键字 | ||||
| 
 | ||||
| 为了向将来Javascript的新版本过渡,严格模式新增了一些保留字:implements, interface, let, package, private, protected, public, static, yield。 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| ## 总结 | ||||
| 
 | ||||
| 至少要能答出四五条。 | ||||
| 
 | ||||
| @ -179,7 +179,7 @@ let x = 'global' | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| **总结1**:this永远指向函数运行时所在的对象,而不是函数被创建时所在的对象。即:**谁调用**,指向谁。 | ||||
| **总结1**:this永远指向**函数运行时所在的对象**,而不是函数被创建时所在的对象。即:**谁调用**,指向谁。 | ||||
| 
 | ||||
| **举例**: | ||||
| 
 | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user