mianshi1

一 js ES5
1.apply call用法 改变this指针 继承
2.this
全局作用域函数 this指向window；
对象的函数，谁调用指向谁；
call后面指向第一个参数；
构造函数的this 指向实例化的对象
3.prototype constructor
4.继承
原型链 继承;
构造函数继承;
组合式继承;
5.立即执行函数
优点 实现闭包和私有数据 变量可以重命名 捕获全局对象 压缩优化

6. 闭包
   解决方式 let 立即执行函数 避免内存泄漏的话 引用 = null
   7.复制数组 a=[...[1,2,3]] 复制对象 Object.assign({},obj)
   8.bind . 函数不会执行 只改变this指针 而且以后再也不改变
   9.节流和防抖
   防抖

function   debounce(handler,delay) {
        var timer = null;
        return  function(){
            var _self = this;
            var _arg = arguments;
            clearTimeout(timer);
            timer = setTimeout(function(){
                handler.apply(_self,_arg)
            },delay)
        }
    }

节流

function throttle(handler.wait){
        var lastTime = 0;
        return function(e){
            var nowTime = new Date().getTiime();
            if(nowTime-lasttime>wait){
                handler.apply(this,arguments);
                lastTime = nowTime;
            }
        }
    }

单例模式
const wzm = {
        init(){
            this.message = "hello";
            this.event();
        },
        event(){
            let div = document.getElementById("one");
            div.onclick = this.show;
        },
        show(e){
            console.log(e.target,this.message)
        }
    }
    wzm.init();

二 ES6
1.let const
2.解构赋值 reset 参数
3.${}
4.object object.assign 对象的合并
5.set 值唯一 add delete clear has
map 键的值 可以是对象 不仅仅是字符串
6.class =>
7.async await

三 JQUERY
1.jquery 无new 构造 jquery.prototype.init.prototype = jquery.prototype
2.jquery.extend 为类本身添加方法 jquery.fn.extend 在jquery原型对象添加方法
3.jquery .fn = jquery.prototype
4.attr和prop
对于HTML元素本身就带有的固有属性，在处理时，使用prop方法。
对于HTML元素我们自己自定义的DOM属性，在处理时，使用attr方法。

(function(){
jquery = function(){
return new jquery.prototype.init();
};
jquery.getName = function(){
console.log("jquery对象本身");
};
jquery.prototype = {
constructor:jquery,
init:function(){
},
each:function(){
console.log("each方法");
return this;
},
each1:function(){
console.log("each1方法");
return this;
}
noflict:functioon(deep){
if(window.$=== jquery){
window.$= _$;
}
if(deep&&window.jquery === jquery){
window.jquery = _jquery;
}
return jquery;
return jquery;
}
}
jquery.prototype.init.prototype = jquery.prototype;
window.$ = jquery;
})()
$.getName();
$().each().each1();

四 VUE
1.vue实现数据的双向绑定
observe 用defineproperty 对数据所有的属性进行监听
compile对每个元素的借点的指令进行扫描或者解析 根据指令模板替换数据或者绑定相应的函数
watch连接 observe和compile 能够接收到属性变形的通知 执行相应的回调函数

2. 全局组件 Vue.component 自定义指令 directive
   3.watch
   4.父组件通信 父传子 props down 子传父 事件传递 this.$emit(event,data) v-on:event="parentMethod"
   兄弟组件通信
   var bus = new Vue()
   // 触发组件 A 中的事件
   bus.$emit('event1')
   // 在组件 B 创建的钩子中监听事件
   bus.$on('event1', function () {}
   // .
   5.vue-router
   <router-link :to="{ name: 'user', params: { userId: 123 }}">User</router-link>
   { path: '/user/:id', component: User }
   router.push({ name: 'user', params: { userId: 123 }})
   router.push({ path: 'register', query: { plan: 'private' }})
   接受 this.$route.params
   mode history(需要后端同步设置) hash(默认)
   全局守卫 route.beforeach
   路由独享守卫 beforeEnter
   组件守卫 beforeRouteEnter
   6vuex
   state
   getters
   actions dispatch 触发
   mutations commit触发
   五 CSS
3. 变量写法：root{
   --color："#fff"
   }
   直接用：var(--color)
   2.清楚浮动 clear both overflow ::after
   3.flex
   4.grid
   六 webpack