我的网站开发技术经验总结 我的网站开发技术经验总结
首页

fangdown

我的网站开发技术经验总结
首页
  • 大前端

  • 基础

    • js

      • 你知道new操作符是如何实现的吗
      • 说说大文件上传的思路
      • 说说对闭包的理解及应用
      • 说说对单点登录sso的理解
      • 说说对防抖节流的理解
      • 说说对函数式编程的理解
        • 是什么
        • 纯函数
        • 高阶函数
        • 柯里化
          • 普遍使用
        • compose
      • 说说对内存泄漏的理解及触发场景
      • 说说对事件模型的理解
      • 说说对事件委托的理解及应用场景
      • 说说对原型及原型链的理解
      • 说说对正则表达式的理解
      • 说说对BOM的理解及常见操作
      • 说说对Dom的理解及常见操作
      • 说说对JavaScript中事件循环的理解
      • 说说对js的执行上下文的理解
      • 说说对js中变量作用域的理解
      • 说说对js中继承的理解及实现方式
      • 说说对this关键字的理解
      • 说说你对 Immutable Data的理解?如何应用在React项目中
      • 说说如何判断数据类型
      • 说说如何判断一个元素在可视区域内
      • 说说如何实现函数缓存
      • 说说深浅拷贝的区别及实现
      • 说说什么是尾递归及其应用
      • 说说为什么0.1+0.2!==0.3
      • 说说下拉刷新,上拉加载的原理
      • 说说ajax的实现原理
      • 说说call-apply-bind的作用及区别
      • 说说js中本地存储有哪些方式及区别
      • 说说js中的类型转换机制
      • Javscript数组的常用方法有哪些?
      • Javscript字符串的常用方法有哪些?
    • css

    • ES6

  • 框架

  • 情商

  • 算法

  • 网络

  • 千锤百炼
  • 基础
  • js
fangdown
2021-09-02
目录

说说对函数式编程的理解

# 是什么

函数式编程: 定义好输入参数, 封装逻辑过程, 输出结果

// 命令式编程
var array = [0, 1, 2, 3];
for (let i = 0; i < array.length; i++) {
  array[i] = Math.pow(array[i], 2);
}

// 函数式方式
[0, 1, 2, 3].map((num) => Math.pow(num, 2));

# 纯函数

定义: 无副作用的函数

  • 特性
    • 输入值相同,返回值相同
    • 不会造成作用域的变化,如修改全量变量或者外部参数
  • 优势
    • 函数可测试
    • 可读性更强
    • 适合模块化

# 高阶函数

定义: 把函数作为参数的函数

const once = (fn) => {
  let done = false;
  return function() {
    if (!done) {
      fn.apply(this, fn);
    } else {
      console.log("该函数已经执行");
    }
    done = true;
  };
};

# 柯里化

定义:把一个多参数函数转换一个嵌套的一元函数的过程。

原函数
新函数=柯里化(原函数)
新函数调用
let fn = (x, y) => x + y;
const curry = function(fn) {
  return function(x) {
    return function(y) {
      return fn(x, y);
    };
  };
};
let newFn = curry(fn);
console.log(newFn(1)(2));

# 普遍使用

// 多参数柯里化;
const curry = function(fn) {
  return function curriedFn(...args) {
    if (args.length < fn.length) {
      return function() {
        return curriedFn(...args.concat([...arguments]));
      };
    }
    return fn(...args);
  };
};
const fn = (x, y, z, a) => x + y + z + a;
const myfn = curry(fn);
console.log(myfn(1)(2)(3)(1));

# compose

组合: 从左到右执行

function afn(a){
    return a*2;
}
function bfn(b){
    return b*3;
}
const compose = (a,b)=>data=>a(b(data));
let myfn =  compose(afn,bfn);
console.log( myfn(2));

管道: 从右到做执行

const compose = (...fns)=>val=>fns.reverse().reduce((acc,fn)=>fn(acc),val);
#js
上次更新: 2021/12/19, 18:05:42
说说对防抖节流的理解
说说对内存泄漏的理解及触发场景

← 说说对防抖节流的理解 说说对内存泄漏的理解及触发场景→

最近更新
01
多分支修复撞车的问题
05-01
02
如何成为架构师
01-23
03
服务器部署全过程
11-23
更多文章>
Theme by Vdoing | Copyright © 2019-2026 fangdown | 粤ICP备19079809号
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式