FrankKai

### 如何获取属性的descriptor？ ```js Object.getOwnPropertyDescriptor(obj,prop) ``` 使用示例： ```js var o = {}; Object.defineProperty(o, 'a', { value: 1 }); Object.getOwnPropertyDescriptor(o,'a') // { // configurable: false // enumerable: false // value: 1 //...

### console.log(a+a+a); // 'abc'题解 ```js /* console.log(a + a + a); // 打印'abc' */ ``` - 解法1: Object.defineProperty() 外部变量 - 解法1(优化版)：Object.defineProperty() 内部变量 - 解法2: Object.prototpye.valueOf() - 解法3：charCodeAt，charFromCode - 解法3(优化版一)：内部变量this._count和_code -...

参考资料： https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDescriptor https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/propertyIsEnumerable

#### 1.vue和vuex中的ES6 Shorthand method names  最近在用vue和vuex开发。 在.vue单文件的生命周期和vuex的actions定义中，有两段代码让人费解： pag.vue ``` export default { //... created(){ this.$store.dispatch('getUsersSize') } //... } ``` action.js中 ``` const actions = { getAllUsers({commit},url){ dataapi.getData(url,(users)=>{ commit(types.RECEIVE_USERS,{users}) })...

#### 2.ng-bind与v-bind的区别是什么？ 首先看个问题：angular中，什么时候用ng-bind，什么时候用{{}}模板写法？ {{foo.bar}}更加直观，但是对于index.html，也就是首页展示，应该使用ng-bind="foo.bar"。 因为如果浏览器可能angular对花括号中的语法完成编译之前，就将{{foo.bar}}中的内容展示给用户，从而导致用户看到我们的代码后，再看到自己的数据。 这与浏览器运行机制有关，浏览器先下载好html的dom层，之后才会使用js对dom层中的内容进行处理，本例中是对标签节点的文本节点{{foo.bar}}进行编译，本质上是替换文本节点。 而ng-bind则是以修改标签的属性内容的形式，为标签增加文本节点，而不是替换文本节点。 与vue的v-bind指令不同，v-bind指令是对标签节点的属性节点绑定model中的数据，例如v-bind:src="imgSrc",而angular中则支持属性中编译花括号，直接使用src="{{imgSrc}}"，即可实现与controller中的数据绑定。 有几点很重要： 1.ng-bind是对文本节点做更新 2.angular可以直接编译属性节点中的花括号值 3.首页数据，应使用ng-bind；其他页为提高代码可读性，应使用{{}}式写法

#### 3.:model与v-model的区别是什么？ >:model 的完整形式是v-bind:model，主要是v-bind，也是双向数据绑定吗，但是针对DOM元素的属性或者特性做绑定，例如src,title原生属性，或者自定义属性等等，我们此处的:model属于iview的Form组件自定义的一个属性。 >v-model 则是为了在或者 表单元素上做双向数据绑定，直接做到了与value的绑定。 吐槽：iview用起来有点反人类，Radio用label做区分，Form的表单数据又用model这样的属性做数据绑定（好吧，elememt-ui也是这样做数据绑定）。 关于src，title类似的HTML原生属性，有一点需要特别注意，那就是v-bind的使用。 Mustache 语法不能作用在 HTML 特性上，遇到这种情况应该使用 v-bind 指令： ` ①` ` ②` ①中的dynamicId是一个变量 ②中的dynamicId仅仅是一个字符串 大多数情况下，我们会使用:id这样的为了让Mustache语法作用于HTML特性上的写法。

### 4.vue 知识点查漏补缺 - vue中props和computed的区别是什么？ 子组件显式地用props选项声明（从父组件获取的）预期的数据。 Computed 计算属性被混入到vue实例中。所有的getter和setter的this上下文自动地绑定为vue实例。 - slot是什么？ 往具名插槽中插入子组件内容。 - 具名插槽是什么？ ``` 这里的内容会被分发到header插槽中 ``` - getter 和 setter ``` vm.aPlus // => 2 vm.aPlus = 3 ``` -...

### 5.表单验证 async-validator 知识点： > rules可以定义冗余，最后会根据实际情况选取验证规则。 原因： >v-if / v-else会移除dom，从而跳过验证。 场景： 通过v-if v-else控制模板渲染时，由于需要根据type进行变换，所以错误认为验证规则需要实时根据当前模板内容进行变换，但实际上验证规则仅需一套。 **下面的代码是完全没有必要的！！！** ``` const _commonRules = { foo: [{ required: true, message: '请选择foo', trigger: 'blur' }], }; switch...

### 6. Vue.extend() 关键词：子类 组件选项 ```HTML ``` ```Javascript var Profile = Vue.extend({ template: '{{firstName}}{{lastName}}aka{{alias}}', data: function() { return { firstName: 'foo', lastName: 'bar', alias: 'baz', } } }) new Profile(),$mount('#mount-point')...

### 7.Vue实例(单文件组件)详解 - 实例属性 - 实例方法 - 数据 - 事件 - 生命周期 #### 实例属性 `vm.$data` getter setter - Vue实例代理data对象上的所有属性，因此vm.a等价于vm.$data.a。 - 以_，$开头的属性不会被Vue实例代理，需要使用vm.$data._property访问这些属性。 - data属性不要使用箭头函数，但是可以使用es6的函数简写。 - data属性为什么要强制要求写成函数类型？因为若是对象，则共同引用同一个对象。而函数类型则是以构造函数的形式，可以创建出一个个独立的数据副本。（引申知识点：引用传递，构造函数） 错误的箭头函数写法 ```Javascript data: () =>...