V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
17lian
V2EX  ›  问与答

关于 js 处理 js 片段脚本的疑问

  •  
  •   17lian · 2023-07-25 10:45:49 +08:00 · 944 次点击
    这是一个创建于 513 天前的主题,其中的信息可能已经有所发展或是发生改变。
    1. 一直有个疑问,现在写前端的时候,都是不推荐使用 eval 的,那那些在线实战 js 的网站都是如何处理 js 脚本,并在线运行的?
    2. 我现在有个一个现实的问题,比如我传给组件一个"aa.bb" 组件接收到这个字符串后,需要通过 form['aa']['bb'] 这样子获取到 form 对象中的值,"aa.bb"不是固定的,也可能是"cc.dd.ee",那就需要处理成 form['cc']['dd']['ee']这样子,不知道,大家有什么好的解决方案
    第 1 条附言  ·  2023-07-25 16:31:12 +08:00

    大家的留言都看了,也是解答了我的一些疑问的 现在有这样一个问题,直接看代码吧

    <el-switch v-model="form['delivery']['value']" />
    
    data() {
        return {
          form: {
            delivery: {
              value: false
            }
          }
        }
      }
    
      methods: {
        onSubmit() {
          console.log(this.form)
        }
      }
    

    打印结果是有层级的对象:

    { delivery: {value: true}}
    

    假如我从前面一个组件传过来一个属性名 'delivery.value', 我怎么把这个'delivery.value' 转换成form['delivery']['value']

    属性名的层级不是固定的,要实现属性双向绑定,保持层级关系

    大家有什么好的办法么

    7 条回复    2023-07-25 13:49:54 +08:00
    syntaxj
        1
    syntaxj  
       2023-07-25 10:56:30 +08:00
    ```
    function readO(str,o) {
    let strArr = str.split('.')
    let current = o
    while(strArr.length) {
    let key = strArr.shift()
    current = current[key]
    }
    return current
    }
    ```这样?
    syntaxj
        2
    syntaxj  
       2023-07-25 11:01:13 +08:00
    @syntaxj 对于 1 vue 源码里的执行是通过 new Function 的 https://github.com/search?q=repo%3Avuejs%2Fcore%20new%20Function&type=code
    tool2d
        3
    tool2d  
       2023-07-25 11:05:00 +08:00
    我页面都是使用别的语言翻译成 JS 来运行的,很多地方都会调用 eval 。

    你说 eval 有安全隐患,但我想说,你写个 chrome 插件就可以随便修改任意页面源代码。这种前端所谓的“安全性”,不是禁用几个函数,就能解决问题的。
    lokitangl
        4
    lokitangl  
       2023-07-25 11:23:24 +08:00   ❤️ 2
    var object = { 'a': [{ 'b': { 'c': 3 } }] };

    _.get(object, 'a[0].b.c');

    搜一下 lodash 就知道了,你能想到的取值路径都能支持
    bleeontheway
        5
    bleeontheway  
       2023-07-25 11:30:13 +08:00
    jazzg62
        6
    jazzg62  
       2023-07-25 13:42:47 +08:00
    1. 不推荐不代表不能用,正确处理好异常就行。new Function 和 eval 类似,new Function 最大的好处就是比 eval 多了一层作用域,相对更安全些
    2. 对这个字符串 split 下,然后遍历去获取参数就可以了,1 楼的就可以
    zjsxwc
        7
    zjsxwc  
       2023-07-25 13:49:54 +08:00
    underscore or lodash search `dotted path`

    https://underscorejs.org/#get
    https://lodash.com/docs#get
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5397 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 36ms · UTC 07:08 · PVG 15:08 · LAX 23:08 · JFK 02:08
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.