javascript - 关于读取数组里的对象内容

  $(document).ready(function(){
    var dataId=$("h2").attr("data-id");
    var arr= new Array(
      {
        "color":"#fb6964",
        "text":"真理惟一可靠的标准就是永远自相符合",
        "author":"欧文"
      },
      {
        "color":"#9b59b6",
        "text":"我需要三件东西：爱情友谊和图书。然而这三者之间何其相通！炽热的爱情可以充实图书的内容，图书又是人们最忠实的朋友",
        "author":"蒙田"
      },
      {
        "color":"#73a867",
        "text":"世界上一成不变的东西，只有“任何事物都是在不断变化的”这条真理",
        "author":"斯里兰卡"
      },
       {
        "color":"#16a085",
        "text":"过放荡不羁的生活，容易得像顺水推舟，但是要结识良朋益友，却难如登天",
        "author":"巴尔扎克"
      },
      {
        "color":"#000",
        "text":"时间是一切财富中最宝贵的财富",
        "author":"德奥弗拉斯多"
      }
      );
    $(".btn").on("click",function(){
      if (dataId!==4) {
        $("h2").html(arr[dataId+1]["text"]).attr("data-id",dataId+1);
        $("body").css("background-color",arr[dataId+1]["color"]);
        $(".btn").css("background-color",arr[dataId+1]["color"]);
        $(".author").text(arr[dataId+1]["text"]);
      }
      console.log(arr[dataId-1].text);
    });
  });

为什么无法读取text的内容？我把中括号改为点号，也同样无法读取对象里面的属性内容，这个是什么原因呢？而console.log却能够正常打印出来