有几个人知道JavaScript的函数是什么，相思雕塑给你们解答

觉得写的可以的话动动手指帮忙点击转发和关注，谢谢

个人经历; 在学习 JavaScript这条路上会遇到很多困难只要坚持一定会给你们带来回报的 。所谓有因就用果。

跟着大前端年代的到来，在产品开发进程中，前端所占事务比重越来越大、交互越来越重。传统的老夫拿起JQuery就是一把梭敷衍当下重交互页面现已十分乏力。于是乎有了Angular，React，Vue这些现代结构。

但随之而来的还有许多的新知识新名词，如MVC，MVVM，Flux这些规划形式就弄得许多同学傻傻分不清。这时分又见到他人评论什么函数式编程，更是一脸懵逼了。

咱们大多听过面向目标编程，面向进程编程，那啥又是函数式编程呢？在咱们前端开发中又有哪些运用场景？我抱着这个疑问，开端的学习了下。（此文仅是学习，无甚干货）。

函数式编程

界说

函数式编程（Functional Programming，后边简称FP），维基百科的界说是：

是一种编程范型，它将电脑运算视为数学上的函数核算，并且防止运用程序状况以及易变目标。函数编程言语最重要的基础是λ演算（lambda calculus）。并且λ演算的函数能够承受函数当作输入（引数）和输出（传出值）。比起指令式编程，函数式编程愈加强调程序履行的成果而非履行的进程，倡议使用若干简略的履行单元让核算成果不断渐进，逐层推导杂乱的运算，而不是规划一个杂乱的履行进程。

我来测验了解下这个界说，如同就是说，在敲代码的时分，我要把进程逻辑写成函数，界说好输入参数，只关怀它的输出成果。并且能够把函数作为输入输出。感觉如同往常写js时，就是这样的嘛！

特性

网上FP的界说与特性琳琅满目。各种百科、博客、一些教师的网站上都有迥然不同的介绍。为了便利阅读，我列下几个如同比较重要的特性，并附上我的第一眼了解。

函数是一等公民。就是说函数能够跟其他变量相同，能够作为其他函数的输入输出。喔，回调函数就是典型运用。

不行变量。就是说，不能用var跟let咯。按这要求，我似乎有点难写代码。

纯函数。就是没有副作用的函数。这个好了解，就是不修正函数外部的变量。

引证通明。这个也好了解，就是说相同的输入，必定是相同的输出。函数内部不依赖外部状况，如一些全局变量。

慵懒核算。粗心就是：一个表达式绑定的变量，不是声明的时分就核算出来，而是真实用到它的时分才去核算。

还有一些衍生的特性，如柯里化与组合，片言只语说不清，就不论述了，有爱好的同学能够自己再了解了解。

FP在JavaScript中的运用

React就是典型的FP。它不同于Vue这样的MVVM结构，它仅仅是个View层。

ReactView = render(data) 它只关怀你的输入，终究给你回来相应视图。所以你休想在react组件中去修正父组件的状况，更没有与dom的双向绑定。

这个是结构上的运用，那么在咱们往常书写JavaScript时有哪些运用呢？换句话说，往常书写js时分，遇到什么状况，咱们选用FP会更好。

从最常见的入手吧，如典型的操作数组：

// 从users中挑选出年龄大于15岁的人的名字 const users = [

{

age: 10,

name: '张三',

}, {

age: 20,

name: '李四' }, {

age: 30,

name: '王五' }

]; // 进程式 const names = []; for (let i = 0; i 15) {

names.push(users[i].name);

}

} // 函数式 const names = users.filter(u => u.age > 15).map(u => u.name);

嗯，代码精简了许多，可是貌似带来了更大的开支。假设是十分大的数据，十分多的挑选工作，那就会循环屡次。

这儿得想到刚刚的慵懒核算。按照慵懒求值的要求，应该是要终究回来成果时，才真实去挑选年纪并得到名字数组。

可是JavaScript的数组并不支撑慵懒求值。这时分咱们得上一些东西库，如Lodash。能够看下它文档中的比方：_.chain。

如同也没好到哪里去啊，不就是把多行代码变一行嘛？说的那么玄乎，还多了性能开支，然后又跟我说得上个东西库。。。

说的如同很有道理，可是for循环是有个弊端的，它产生了变量i，而这个变量又是不行控的，假设事务逻辑一杂乱，谁知道它循环到什么时分i有没有发生变化，然后导致循环出问题呢？

咱们再看一个与DOM交互的场景：

假设页面有一个按钮 button ，咱们需求求出用户点击了几次，可是一秒钟内重复点击的不算。传统方法会这么写。

var count = 0; var rate = 1000; var lastClick = Date.now() - rate; var button = document.querySelector('button');

button.addEventListener('click', () => { if (Date.now() - lastClick >= rate) { console.log(`Clicked ${++count} times`);

lastClick = Date.now();

}

});

妥，彻底没问题。可是发现多了许多状况，count，rate，lastClick，还得比照来比照去。那假设用FP会是怎么样的呢？

抱愧。。。无法写。。。除非很强大的编程才干，自己封装好方法去处理。所以在这儿，咱们能够上个东西---Rx.js，上述的比方就是rxjs中引证的，咱们看它是怎么高雅地处理的。

var button = document.querySelector('button');

Rx.Observable.fromEvent(button, 'click')

.throttleTime(1000) // 每隔1000毫秒才干触发事情 .scan(count => count + 1, 0) // 求值，默认值是0 .subscribe(count => console.log(`Clicked $ times`)); // 订阅成果、输出值

巧夺天工！再也不用去办理状况了，不需求声明一堆变量，修正来修正去，判别来判别去，几乎完美。

往常咱们有许多需求更新dom的异步操作，如查找行为：用户接连输入查询值，假设停顿半秒就履行查找，假设查找了屡次，发起了屡次恳求，那只回来终究输入的那次查找成果。

闭上眼想想，你之前是怎么完成的。横竖我都是设置开端时刻，完毕时刻，上次时刻，等等变量。繁琐，并且不行控。

当咱们以FP的思想去完成时，就会想方设法的削减变量，来高雅程序。最常见的方法就是用下他人的东西库来完成它。当然有些简略的场景也能够自己完成，最主要的仍是要有这个意识。

其实咱们往常现已写了一些FP了，只是咱们没意识到，或许没怎么写好。就比方闭包，许多人都不了解闭包的概念，但实践上现已写了许多闭包代码。其实闭包自身也是函数式编程的一个运用。

鉴于我自己了解也不深，无法多论述FP的运用，咱们假设有爱好，能够多了解了解。

FP在JavaScript中的优下风

总结一下FP的优劣，以便于咱们在实践开发中，能更好的选择是否选用FP。

优势

更好的办理状况。由于它的主旨是无状况，或许说更少的状况。而往常DOM的开发中，由于DOM的视觉呈现依托于状况变化，所以不行防止的产生了十分多的状况，并且不同组件可能还相互依赖。以FP来编程，能最大化的削减这些不知道、优化代码、削减出错状况。

更简略的复用。极点的FP代码应该是每一行代码都是一个函数，当然咱们不需求这么极点。咱们尽量的把进程逻辑以更纯的函数来完成，固定输入->固定输出，没有其他外部变量影响，并且无副作用。这样代码复用时，彻底不需求考虑它的内部完成和外部影响。

更高雅的组合。往大的说，网页是由各个组件组成的。往小的说，一个函数也可能是由多个小函数组成的。参阅上面第二点，更强的复用性，带来更强大的组合性。

隐性优点。削减代码量，进步保护性。

下风

JavaScript不能算是严厉意义上的函数式言语，许多函数式编程的特性并没有。比方上文说的数组的慵懒链求值。为了完成它就得上东西库，或许自己封装完成，进步了代码编写本钱。

跟进程式比较，它并没有进步性能。有些当地，假设强制用FP去写，由于没有中心变量，还可能会下降性能。

代码不易读。这个因人而异，因码罢了。特别了解FP的人可能会觉得这段代码一望而知。而不了解的人，遇到写的不流畅的代码，看着一堆堆lambda演算跟匿名函数 () => () => () 瞬间就懵逼了。看懂代码，得脑子里先演算半小时。

学习本钱高。一方面承继于上一点。另一方面，许多前端coder，就是由于相对不喜欢一些底层的笼统的编程言语，才来踏入前端坑，你现在又让他们一头扎入FP，显得手足无措。

总结

个人觉得，FP仍是好的。关于开发而言，确确实实能优化咱们的代码，了解之后，也能进步编程功率。关于编程自身而言，也能拓展咱们的思想，不限制在进程式的编程代码。

在编写JS中，能够尽量的运用FP的思想，如不行变量、纯函数、慵懒求值。但也不用教条式的遵从函数式编程，一定要怎样怎样。比方咱们看下知乎大V某温的一个答复：传送门。

唉，做个页面仔不容易啊。可是不想当大牛的页面仔不是好页面仔！ 最后给大家推荐一本书希望你们在里面了解更多。

这本书会给你们提升自己的能力