2021-03-10

js

判断以下输出的值

var a = {},
    b = "123",
    c = 123;
a[b] = "b";
a[c] = "c";
console.log(a[b]);

var a = {},
    b = Symbol("123"),
    c = Symbol("123");
a[b] = "b";
a[c] = "c";
console.log(a[b]);

var a = {},
    b = { key: "123" },
    c = { key: "456" };
a[b] = "b";
a[c] = "c";
console.log(a[b]);

第一个题答案为'c'。
首先，如果对对象使用中括号语法，那么中括号里面的值为变量（当然，a['b']除外），所以a[b] = 'b' 实际表示a.123 = 'b',同理，a[c] = 'c' 实际等于a.123 = 'c'， 这里唯一的区别在于b与c一个是字符串，一个是数字，但是普通对象的属性只能是字符串，symbol值跟表达式，所以遇到非字符串属性会自动转换为字符串，这样a[c] = 'c'就覆盖了a[b] = 'b' ，最后a实际等于{123: "c"}所以打印a[b] 会输出'c'

第二题答案为'b'。
首先在定义b和c变量时，虽然同样是symbol('123')，但是symbol特性是定义一个独一无二的值，所以b与c是不相等的两个变量。最后a实际等于{Symbol(123): "b", Symbol(123): "c"}，所以打印a[b]会输出'b'

第三题答案为'c'
首先b与c定义为了对象，在第一天我们说到对对象使用中括号语法实际是中括号里面的值为一个变量，那么此时a[b]就等于a.{key: 123}，但我们也说过，普通对象属性只能为字符串，symbol值或者表达式，所以这里要用toString()方法进行转换。任何对象调用toString()方法都会返回"[object Object]",所以a[b]最终变成了a.[object Object]，a[c]的结果与之相同，所以a[c]会覆盖掉a[b]，最后打印a[b]输出'c'。

vue

Vue 的父组件和子组件生命周期钩子执行顺序是什么

1. 父组建： beforeCreate -> created -> beforeMount
2. 子组件： -> beforeCreate -> created -> beforeMount -> mounted
3. 父组件： -> mounted
4. 总结：从外到内，再从内到外