一 使用 .
点 一般操作静态对象来存取属性

mounted(){
    let obj = {
      a:"m1",
      b:"m2"
    }
    console.log("a---",obj.a)//m1
  }

我们平常开发中会多使用第一种方式,系统会把调用的obj.a自动隐式转换成 :obj[‘a’]来执行,所以第二种会比第一种快捷。

二 使用 [] (又称数组表示法)
中括号 一般操作动态对象来存取属性

mounted(){
    let obj = {
      a:"m1",
      b:"m2"
    }
    console.log("b---",obj['b'])//m2
  }

共同点:以上两种都可以实现属性的存取。
区别:
第一种obj.a 点后面是对象中的属性名,必须是一个指控的属性名。第二种 obj[‘a’] []里面必须是字符型。

使用场景:
当动态为某个对象添加属性时用第二种合适。动态操作对象时。

mounted(){
    let obj1 = {
      haha1:{a1:1,b1:1},
      haha2:{a2:2,b2:2},
      haha3:{a3:3,b3:3},
      btn:function(num){
        return obj1['haha'+num]
      }
    }
    let result = obj1.btn(3)
    console.log("result---",result)
  }

Java 动态的获取属性并赋值 js 动态获取对象的属性_数组


三 结合剩余参数使用

<div @click="btn(1,'msg')">btn</div>
 btn(data,...val){
    console.log("data---",data)//始终接收第一个参数==1
    console.log("val---",val)//["msg"] 
    console.log("c---",val[0])//msg
    console.log(typeof(['msg']))//object类型
    if(val == "msg"){
      console.log('yes')//yes
    }else{
      console.log('no')
    }
  }
  //当object只有一个参数时如['msg'],用...val接收时
  // val==['msg']==msg  所以  val=='msg'