浅谈函数式编程和命令式编程的区别

一、函数式编程

------------------------------------------------------------------------------------------------------------------------------------------

函数式编程用一个英文单词来说的话就是“What?” 它关注结果

定义

• 把某个功能的具体实现，封装到函数内部（例如本案例中，内置的forEach方法，就是把循环每一项的操作，封装到了函数内部）

优势

• 后期别人直接使用这个函数，即可实现对应的效果，无需关注内部底层是如何处理的，有利于开发效率的提高和学习使用* 减少页面冗余代码「低耦合高内聚」 弊端

---

• 操作起来不够灵活 内部核心的处理我们是无法修改的

二、命令式编程

命令式编程用一个英文单词来说的话就是“How?” 它关注过程

定义

具体如何去处理,是由自己实现及掌控的,关注How的过程

优势

• 操作灵活,可以自主把控处理的每一个步骤* 处理性能一般比函数式编程式要好「例如：forEach循环要慢于for循环」总结：处理的数据量“较多”的情况下，使用命令式编程来提高性能！操作逻辑较为复杂，需要自己灵活把控处理步骤的情况下，也使用命令式编程！其余情况，优先推荐函数式编程！

下面我们通过一个具体的案例来体会这两种编程方式的不同

三、需求:将下面字母大写转小写，小写转大写

function caseChange() {
}
caseChange('aBc')//=>'AbC'
caseChange('aHtReI')//=>'AhTrEi' 

整体思路

• 依次拿到字符串中的每一个字符 charAt* 判断一下当前的字符是大写还是小写[如果是大写，我们把其转换为小写，反之转为大写]* 把某个字符先转成小写和之前的自己进行比较 如果相等则是小写，反之大写* 例如：‘A’ @1 把其变为小写’a’ @2 ‘a’!=‘A’ 之前是大写
• 把处理后的字符重新拼接起来即可方案1 循环

---

思路

• 循环字符串中的每个字符* 获取当前迭代的这个字符* 验证其 大写还是小写* 大写->小写 小写->大写 最后拼接到result中即可```
  function caseChange(str) {let result=“”;//循环字符串中的每个字符，for(let i=0;i<str.length;i++){//获取当前迭代的这个字符let char=str.charAt(i);//验证其 大写还是小写let isLoower=char.toLowerCase()===char;// 大写->小写 小写->大写 最后拼接到result中即可result+=isLoower?char.toUpperCase():char.toLowerCase();}return result;}

方案2 forEach
-----------

### 思路

* 把字符串拆成数组，每一个字符就是数组的每一项，这样我们就可以使用数组的forEach来循环* 大写->小写 小写->大写 最后拼接到result中即可```
 function caseChange(str) {let result="";//把字符串拆成数组，每一个字符就是数组的每一项，这样我们就可以使用数组的forEach来循环了str.split('').forEach((char)=>{//char ：循环的每个字符let isLoower=char.toLowerCase()===char;// 大写->小写 小写->大写 最后拼接到result中即可result+=isLoower?char.toUpperCase():char.toLowerCase();})return result;
} 

方案3 map

思路

• 把字符串拆成数组，每一个字符就是数组的每一项，这样我们就可以使用数组的map来循环了* 大写->小写 小写->大写 最后拼接到result中即可```
  function caseChange(str) { let result = ‘’; return str.split(‘’).map((char)=>{//char ：循环的每个字符let isLoower=char.toLowerCase()===char;return result+=isLoower?char.toUpperCase():char.toLowerCase();}).join(‘’);
  }

方案4 charAtCode
--------------

### 思路

* 把字符串拆成数组，每一个字符就是数组的每一项，这样我们就可以使用数组的forEach来循环* 利用charCodeAt获取每一个字符的编码值* 大写->小写 小写->大写 最后拼接到result中即可```
function caseChange(str) {let result = '';str.split('').forEach(char => {// charCodeAt:获取某个字符ASCII码表中对应的十进制的值// 65~90 A-Z 97~122 a-z 48~57 零到九的数字...let dec = char.charCodeAt();result += (dec >= 97 && dec <= 122) ? char.toUpperCase() : char.toLowerCase();});return result;
}
console.log(caseChange('aBc'));; //=>'AbC'
console.log(caseChange('aHtReI'));; //=>'AhTrEi' */ 

最后

最近还整理一份JavaScript与ES的笔记，一共25个重要的知识点，对每个知识点都进行了讲解和分析。能帮你快速掌握JavaScript与ES的相关知识，提升工作效率。

有需要的小伙伴，可以点击下方卡片领取，无偿分享