【JavaScript】10个比较常见的JavaScript学习难点

不少新人都想学习前端开发，可是在前端开发当中，HTML和CSS都算是比较简单和直观的，惟独JavaScript，是相对来讲比较难并且比较多变的，那么咱们今天就来讲说看，在JavaScript学习中，相对比较常见的10个难点。

 

当即执行函数

 

当即执行函数，即Immediately Invoked Function Expression (IIFE)，正如它的名字，就是建立函数的同时当即执行。它没有绑定任何事件，也无需等待任何异步操做：

 

function(){…}是一个匿名函数，包围它的一对括号将其转换为一个表达式，紧跟其后的一对括号调用了这个函数。当即执行函数也能够理解为当即调用一个匿名函数。当即执行函数最多见的应用场景就是：将var变量的做用域限制于大家函数内，这样能够避免命名冲突。

 

闭包

 

对于闭包(closure)，当外部函数返回以后，内部函数依然能够访问外部函数的变量。

 

 

代码中，外部函数f1只执行了一次，变量N设为，并将内部函数f2赋值给了变量result。因为外部函数f1已经执行完毕，其内部变量N应该在内存中被清除，然而事实并非这样：咱们每次调用result的时候，发现变量N一直在内存中，而且在累加。为何呢？这就是闭包的神奇之处了！

 

使用闭包定义私有变量

 

一般，JavaScript开发者使用下划线做为私有变量的前缀。可是实际上，这些变量依然能够被访问和修改，并不是真正的私有变量。这时，使用闭包能够定义真正的私有变量：

 

 

代码中，对象p的的name属性为私有属性，使用p.name不能直接访问。

 

prototype

 

每一个JavaScript构造函数都有一个prototype属性，用于设置全部实例对象须要共享的属性和方法。prototype属性不能列举。JavaScript仅支持经过prototype属性进行继承属性和方法。

 

 

代码中，x和y都是构造函数Rectangle建立的对象实例，它们经过prototype继承了getDimensions方法。

 

模块化

 

JavaScript并不是模块化编程语言，至少ES6落地以前都不是。然而对于一个复杂的Web应用，模块化编程是一个最基本的要求。这时，可使用当即执行函数来实现模块化，正如不少JS库好比jQuery以及咱们Fundebug都是这样实现的。

 

 

所谓模块化，就是根据须要控制模块内属性与方法的可访问性，即私有或者公开。在代码中，module为一个独立的模块，N为其私有属性，print为其私有方法，decription为其公有属性，add为其共有方法。

 

变量提高

 

JavaScript会将全部变量和函数声明移动到它的做用域的最前面，这就是所谓的变量提高(Hoisting)。也就是说，不管你在什么地方声明变量和函数，解释器都会将它们移动到做用域的最前面。所以咱们能够先使用变量和函数，然后声明它们。

 

可是，仅仅是变量声明被提高了，而变量赋值不会被提高。若是你不明白这一点，有时则会出错：

 

为了不BUG，开发者应该在每一个做用域开始时声明变量和函数。

 

柯里化

 

柯里化，即Currying，能够是函数变得更加灵活。咱们能够一次性传入多个参数调用它；也能够只传入一部分参数来调用它，让它返回一个函数去处理剩下的参数。

 

 

代码中，咱们能够一次性传入2个1做为参数add(1)(1)，也能够传入1个参数以后获取add1与add10函数，这样使用起来很是灵活。

 

apply, call与bind方法

 

JavaScript开发者有必要理解apply、call与bind方法的不一样点。它们的共同点是第一个参数都是this，即函数运行时依赖的上下文。

 

三者之中，call方法是最简单的，它等价于指定this值调用函数：

 

 

apply方法与call方法相似。二者惟一的不一样点在于，apply方法使用数组指定参数，而call方法每一个参数单独须要指定：

 

apply(thisArg, [argsArray])

 

call(thisArg, arg1, arg2, …)

 

 

使用bind方法，能够为函数绑定this值，而后做为一个新的函数返回：

 

 

Memoization

 

Memoization用于优化比较耗时的计算，经过将计算结果缓存到内存中，这样对于一样的输入值，下次只须要中内存中读取结果。

 

 

函数重载

 

所谓函数重载(method overloading)，就是函数名称同样，可是输入输出不同。或者说，容许某个函数有各类不一样输入，根据不一样的输入，返回不一样的结果。凭直觉，函数重载能够经过if...else或者switch实现，这就不去管它了。jQuery之父John Resig提出了一个很是巧(bian)妙(tai)的方法，利用了闭包。

 

从效果上来讲，people对象的find方法容许3种不一样的输入: 0个参数时，返回全部人名；1个参数时，根据firstName查找人名并返回；2个参数时，根据完整的名称查找人名并返回。

 

难点在于，people.find只能绑定一个函数，那它为什么能够处理3种不一样的输入呢？它不可能同时绑定3个函数find0,find1与find2啊！这里的关键在于old属性。

 

由addMethod函数的调用顺序可知，people.find最终绑定的是find2函数。然而，在绑定find2时，old为find1；同理，绑定find1时，old为find0。3个函数find0,find1与find2就这样经过闭包连接起来了。

 

根据addMethod的逻辑，当f.length与arguments.length不匹配时，就会去调用old，直到匹配为止。

 

 

 

 

最后

 

这10个就是咱们比较常见的JavaScript学习难点，有些你们或许还没接触过，有些是已经掌握的了。无论怎么样，JavaScript都是前端开发工程师必备的技能点，若是你还没能掌握好JavaScript，必定要加把劲咯！