Javascript：在对象文字中调用函数

Question

我正在学习用Javascript编程，我想要一些帮助/澄清。

我声明了一个包含动物名字的数组。我定义了一个函数，用于将字符串拆分为两个。然后我创建一个空对象文字并添加一个动物和相应的品种。我试图在对象文字中调用separateWords函数，但我需要澄清一些。这是我的代码：

var myPets = ["Bengal Bobcat", "Beagle"];

var separateWords = function (string) {
    return string.split(" ");
};

var nameCollection = {};
nameCollection.cat = separateWords(myPets[0]);  
nameCollection.dog = myPets[1];
nameCollection.fish = null;

当我输入console.log（nameCollection）时，我得到以下内容：

Object {cat: Array[2], dog: “Beagle”, fish: null}
cat: Array[2]
0: "Bengal"
1: "Bobcat"
length: 2

但是，当我输入console.log（separateWords（myPets [0]））时，我看到：

[“Bengal”, “Bobcat”]

我不明白为什么cat的值显示为Array [2]。

Answer 1

控制台将其显示为Array [2]，因为如果它完全展开它将会（可能）不可读。查看所有内容的一种方法是使用JSON.stringify stringify ，它以递归方式遍历对象中的每个项目并在其上调用toString()：

var myPets = ["Bengal Bobcat", "Beagle"];

var separateWords = function (string) {
    return string.split(" ");
};

var nameCollection = {};
nameCollection.cat = separateWords(myPets[0]);  
nameCollection.dog = myPets[1];
nameCollection.fish = null;

document.body.textContent = JSON.stringify(nameCollection);

Answer 2

您要将cat函数调用的结果分配给separateWords()，并将myPets[0]作为参数传递。

separateWords()返回一个数组，并使用myPets[0]输入返回一个新数组，其中"Bengal"和"Bobcat"值由空格分隔。

split（）函数是创建具有拆分值的数组的函数，此结果由separateWords()函数返回，该函数也是分配给cat对象成员的值。

Answer 3

每个浏览器都按照自己的意愿实现其控制台。

因此，您的浏览器决定实施您描述的行为。

如果您不喜欢它，请向此浏览器的开发人员提出更好的建议。或者使用其他浏览器。

Answer 4

我将假设您使用的是Chrome开发者工具或Firebug。

开发人员工具将数组和对象压缩成易于阅读的行，然后再进行检查。我的意思是，你在控制台日志中的每一行旁边按下小箭头以进一步检查每个对象。我会用图片来解释这个。

这里我分配一个数组，然后将对象中的元素分配给该数组：

正如您所看到的，当我记录对象时，它显示的是一个数组[2]，而不是展开数组。在下一张图片中，我然后展开数组来检查它。

这究竟是为什么？我的第一个想法是易于阅读。如果您的应用程序很复杂并且您有许多调试控制台日志，则可以在单行上查看所有日志，从而更容易搜索特定日志。同样，如果你有一个非常庞大和复杂的对象，可以更容易地读取每一行上的所有根元素，而不会递归地扩展该对象中的所有对象和数组。

Answer 5

String.prototype.split（）返回一个数组，其中包含已拆分的字符串中的两个值。 Read through this.

nameCollection.cat = separateWords(myPets[0])[0]; // nameCollection.cat == Bengal
nameCollection.cat = separateWords(myPets[0])[1]; // nameCollection.cat == Bobcat

Answer 6

这就是javascript（以及许多其他语言）的工作原理。当您尝试打印“nameCollection”时，javascript不会自动执行打印cat数组的好工作。相反，它只是打印一些类型相关的信息，在这种情况下，“cat”是一个长度为2的数组。