控制台打印的vue组件实例,怎么看?

大伯格
  • 371

clipboard.png

我是在vue组件里通过console.log(this)打印出来的上图。
谁能帮我解读一下打印出来的东西怎么看?

  1. 为什么打印的出对线,是有名字的??正常来讲打印出来的东西不是不会标名字吗?例如下图:

clipboard.png

  1. 同上,也是有名字
  2. 这些浅色的属性是什么属性?我本来以为是原型链上的属性,但是proto上的同样是浅色,所以浅色表示什么类型的属性?

1 2 知道了,是构造器的名字,但是3是什么意思还是不知道

回复
阅读 6.6k
3 个回答

3 是 getter 属性
类似

const a = {get k(){return '123'}}
console.log(a)

doterlin
  • 248

你打印出来的是某个非原生类的实例就有名字:

function A(){}
var a = new A();
console.log(a); // => A {}

var b = {};
console.log(b) // => {}, 比如Object类的实例不会显示Object

//第三点是设置对象属性的可枚举/可读可写:
var c = {c1: 'xxx'};
Object.defineProperty(c, "c2", {
  enumerable: false,
  configurable: false,
  writable: false,
  value: "c2"
});
console.log(c); //c1就是显示的,c2是隐式的

c.c1 = "666";
c.c2 = '666';
console.log(c); // =>{c1: "666", c2: "c2"},c1能写,c2的值不能 
for(var cItem in c){
  console.log(cItem + ': ' + c[cItem]);
} // => 'c1: 666',c1能被枚举,c2不能。
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏