和阿昌老师的每日问答Day22. 简述不同情况下this指向这是函数的最通常用法，属于全局性调用，在浏览器中全局对象就

问题

水平垂直居中的方法
简述不同情况下this指向
谈谈你对MVVM的理解

回答

1.水平垂直居中的方法

居中元素定宽高

absolute + 负margin

absolute + margin auto

absolute + calc

居中元素不定宽高

absolute + transform

lineheight

writing-mode

table

css-table

flex

grid

2. 简述不同情况下this指向

纯粹的函数调用

这是函数的最通常用法，属于全局性调用，在浏览器中全局对象就是window。

function a(){
    var user = "Tom";
    console.log(this.user); //undefined
    console.log(this); //Window
}
a();

作为对象方法的调用

函数还可以作为某个对象的方法调用，这时this就指这个上级对象。

var name = "user1";
var obj= {
    name: "user2",
    getName: function () {
        console.log(this.name);
    }
}
obj.getName();//user2

函数作为构造函数调用

函数作为构造函数调用时this指向用该构造函数构造出来的新对象。

function test(){
    this.x = 1;
}
var o = new test();
console.log(o.x);//1

(引申改变this指向)

3. 谈谈你对MVVM的理解

MVVM分为Model、View、ViewMode三者。

Model：代表数据模型，数据和业务逻辑都在Model层中定义；
View：代表UI视图，负责数据的展示；
ViewModel：负责监听Model中数据的改变并且控制视图的更新，处理用户交互操作；

Model和View并无直接关联，而是通过ViewModel来进行联系的，Model和ViewModel之间有着双向数据绑定的联系，因此当Model中的数据改变时会触发View层的刷新，View中由于用户交互操作而改变的数据也会在Model中同步。这种模式实现了Model和View的数据自动同步，因此开发者只需要专注对数据的维护操作即可，而不需要自己操作dom。