使用ECMAscript的“括号表示法”：

myTextOptions[ 'character names' ].kid;

字符串
你可以用任何一种方式，阅读和写。
欲了解更多信息，请阅读此处：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects

JavaScript对象的属性也可以使用括号表示法访问或设置（更多细节请参见property accessors）。对象有时被称为关联数组，因为每个属性都与一个可用于访问它的字符串值相关联。因此，例如，您可以访问myCar对象的属性如下：

myCar['make'] = 'Ford';
myCar['model'] = 'Mustang';
myCar['year'] = 1969;

字符串
更多信息，请阅读Working with JS Objects。
所以在你的例子中是myTextOptions['character names'].kid;

我们也可以通过-
myTextOptions[ 'character names' ]['kid'] ;
当我们有连续的键由空格组成时，这很有用。

让我在这里分享我的解决方案，我使用VueJs和类型脚本。
我得到了下面的json来解析并在UI中显示

{
    "Brand": "MAMA",
    "Variety": "Instant Noodles Coconut Milk Flavour",
    "Style": "Pack",
    "Country": "Myanmar",
    "Stars": 5,
    "Top Ten": "2016 #10"
  },

字符串
我在Typescript中创建了以下模型干涉

export interface Resto {
    Brand: string;
    Variety: string;
    Style: string;
    Country: string;
    Stars: any;
    Top_Ten: string;
    }

型
我调用了API，如下所示：

public async getListOfRestos() {
    return (await fetch(
      `http://starlord.hackerearth.com/TopRamen`,
      {
        method: "get",
        credentials: "include",
        headers: {
          "Content-Type": "application/json",
        },
        body: undefined
      }
    )) as IFetchResponse<Resto[]>;
  }

型
在JSX中使用：

<div class="parent" v-for="(x,i) in listOfRestos" :key="i">
      <div>{{x.Brand}}</div>
      <div>{{x.Variety}}</div>
      <div>{{x.Style}}</div>
      <div>{{x.Country}}</div>
      <div>{{x.Stars}}</div>
      <div>{{x['Top Ten']}}</div>
  </div>

型
同样也可以在React和Angular中工作。