js中函数动态调用

文章目录

一、场景

JS开发中,例如有些场景下,后端要求一个功能要请求不同的接口,但是传参及后续逻辑其实都是一样的,有些同学可能会想到在接口url处统一处理就好,但是不在本篇文章要讲的范围。在源头处理,动态调用多个方法名,其实也就可以了

二、方法

2.1、动态函数

javascript 复制代码
import { start, startFree } from "@/api/design";

export default {
  methods: {
    // 动态接口
    saveOne() {
	  const fun = !this.isAuth ? startFree : start
	  fun();
    },
    // 动态方法
    fn1() {},
    fn2() {},
    saveTwo() {
	  const fun = !this.isAuth ? 'fn1' : 'fn2'
	  this[`${fun}`]();
    }
  }
}

2.2、eval()函数

比如传入一个 funName这个参数,并且想要执行参数对应的的函数,可以使用eval()函数。

javascript 复制代码
function funName () {
	console.log('11111')
}
const test = 'funName'
// test() // 这样肯定报错
eval(test+'()');

三、最后

本人每篇文章都是一字一句码出来,希望对大家有所帮助,多提提意见。顺手来个三连击,点赞👍收藏💖关注✨,一起加油☕

相关推荐
excel5 小时前
ES6 中函数的双重调用方式:fn() 与 fn\...``
前端
可乐爱宅着5 小时前
全栈框架next.js入手指南
前端·next.js
你的人类朋友7 小时前
什么是API签名?
前端·后端·安全
会豪9 小时前
Electron-Vite (一)快速构建桌面应用
前端
中微子9 小时前
React 执行阶段与渲染机制详解(基于 React 18+ 官方文档)
前端
唐某人丶9 小时前
教你如何用 JS 实现 Agent 系统(2)—— 开发 ReAct 版本的“深度搜索”
前端·人工智能·aigc
中微子9 小时前
深入剖析 useState产生的 setState的完整执行流程
前端
遂心_9 小时前
JavaScript 函数参数传递机制:一道经典面试题解析
前端·javascript
小徐_23339 小时前
uni-app vue3 也能使用 Echarts?Wot Starter 是这样做的!
前端·uni-app·echarts
RoyLin10 小时前
TypeScript设计模式:适配器模式
前端·后端·node.js