當在chrome的控制檯中使用console.dir()時,對象的屬性稍微變淡時,這意味着什麼。在Chrome開發人員工具控制檯中使用console.dir時,褪色屬性的意義
例如,在此屏幕截圖中查看「top,width,worldVisible,x & y」。
我已經看過了API參考這裏https://developer.chrome.com/devtools/docs/console-api#consoledirobject,但沒有運氣。
感謝
當在chrome的控制檯中使用console.dir()時,對象的屬性稍微變淡時,這意味着什麼。在Chrome開發人員工具控制檯中使用console.dir時,褪色屬性的意義
例如,在此屏幕截圖中查看「top,width,worldVisible,x & y」。
我已經看過了API參考這裏https://developer.chrome.com/devtools/docs/console-api#consoledirobject,但沒有運氣。
感謝
褪色屬性apper指示不可枚舉的屬性。如果我們這樣做:
var a = {};
Object.defineProperties(a, {
hello: { enumerable: false },
world: { enumerable: true }
});
console.dir(a);
然後我們看到hello
褪色,而world
不是。
在你的代碼,如果你做for(prop in obj) { console.log(prop); }
(其中obj
是什麼目的你向我們展示在您的控制檯截圖),你會看到只有褪色性能不一一列舉。
你也可以用Object.getOwnPropertyDescriptor(obj, "worldVisible")
來檢查它,它應該返回一個帶有enumerable: false
屬性的對象。
請注意,屬性名稱上的斜體表示屬性值由getter函數定義。 (這也會導致該值在運行該函數之前顯示(...)
值。)這與enumerability完全不同,它會導致名稱變淡。您可以使用傾斜的getter定義的屬性,這些屬性不是褪色的不可枚舉屬性,反之亦然。
進行了一些測試,包括原始對象,它看起來像是正確的答案。也意味着它畢竟值得了解,所以我很高興我問了。 – Ben
我一直沒能在文檔中找到任何官方的解釋,但我有一個基於一些測試,變灰屬性是一個很好的猜測那些違約/由JavaScript引擎和設置而不是代碼本身。下面是一些例子:
length
在Arrayvar foo = [1,2,3,45,1337];
console.dir(foo);
給出了控制檯:
注意索引不會變灰,但length
一切都在__proto__
是。
var Person = function() {
this.canTalk = true;
};
Person.prototype.greet = function() {
if (this.canTalk) {
console.log('Hi, I am ' + this.name);
}
};
var Employee = function(name, title) {
Person.call(this);
this.name = name;
this.title = title;
};
Employee.prototype = Object.create(Person.prototype);
Employee.prototype.constructor = Employee;
Employee.prototype.greet = function() {
if (this.canTalk) {
console.log('Hi, I am ' + this.name + ', the ' + this.title);
}
};
var bob = new Employee('Bob', 'Builder');
bob.greet();
console.dir(bob);
給出了控制檯:
有很多有趣的東西在這裏。 greet
的所有實例都不會變灰。然而無處不在__proto__
灰顯(可能是因爲它由引擎設置爲其原型)。 Person
的重寫構造函數也灰顯,但Employee
的顯式設置構造函數未灰顯。
所以我認爲這裏有一個粗略的模式,那就是Chrom(e/ium)將它認爲你不太可能關心的屬性弄暈,要麼是因爲它們是被繼承或設置的引擎作爲語言的一種構造,但它似乎並不完美。 (但誰是,對吧?)另一個有趣的嘗試是F12和console.dir(window)
。在這裏你會看到幾乎所有東西都變灰,除了網站的Javascript放入全局窗口命名空間的東西。
只要展開對象,或者是否需要單擊「(...)」,那些褪色屬性是否具有值? – apsillers
@apsillers,在我的例子中,我需要點擊它們。儘管與你的答案中的枚舉屬性完全相關。謝謝 – Ben
我問過因爲italic屬性名稱表示一個getter函數,但斜體getter也會導致'(...)'行爲。如果你有一個沒有'(...)'的斜體屬性,那麼這將是不尋常的。不過,你確實擁有它,所以這很正常。 (我對這個答案加了一點點。) – apsillers