js对象如何通过变量读取属性

先看看js读取属性的常见的方法。

1.通过.的方式读取

let obj = {
  name:"javascript",
  price:20000
}
console.log(obj.name,obj.price)

2.通过[变量名]的方式读取

let obj = {
  name:"javascript",
  price:20000
}
console.log(obj['name'],obj['price'])

如果有这样一段代码，输出结果会是什么呢？

let a = 'name
let obj = {
    name:"javascript"
}
console.log(obj.a)

结果如下：

为什么是undefined，而不是JavaScript，英文obj.a的意思是obj['a']，他是去找obj里面的a这个属性，而不会把a当作一个变量，这是关键。如果是obj[a]的话结果就是'javascript' ，obj[a]等价于obj['name']等价于obj.name。

 

好，如果我们要给一个函数传参数，参数是一个对象，对象的属性是一个变量该如何传递。看下面的代码。

//这是一个将表格中某一个输入框内的小写字母变为大写字母的函数
const lowerToUpper = (type,value)=>{
    //form1就是那个表格,setFieldsValue是改变表格值的方法，参数是一个对象，你想要改变那个一输入框的值，就把该输入框的name属性的值当作key，输入框的值当作value传递.
   /*
    form1.setFieldsValue({
      password:value.toUpperCase()//就是把name值为password的输入框的值改为大写
    })
    */

    //当传递的type不同时，要进行改变的输入框也就不同（可能是在操作不同的输入框），这时候我们读取type值作为对象的属性就要使用[type]的方法才能正确拿到不同的属性
    form1.setFieldsValue({
      [type]:value.toUpperCase()
    })
  }