js定义css变量

    <style>
        html,body{
            width: 100%;height: 100%;overflow: hidden;
        }
        #beard {
            position: relative;
            width: 60px;
            height: 60px;
            margin: 200px auto 0 auto;
            border-radius: 50%;
            box-shadow: 50px 80px 0 0 currentColor, 100px 80px 0 0 currentColor;
            -webkit-box-reflect: left 80px;
        }
        #beard:after,#beard:before{
            content: '';
            position: absolute;
            top: 40px;
            width: 70px;
            height: 40px;
            border: 0 solid transparent;
            border-bottom: 60px solid currentColor;
        }
        #beard:after{
            left: 10px;
            border-radius: 0 0 0 100%;
            transform-origin: right 70px;
            transform: rotate(calc(-20deg - 30deg * var(--qw)));
        }
        #beard:before {
            left: 130px;
            border-radius: 0 0 100% 0;
            transform-origin: left 70px;
            transform: rotate(calc(20deg + 30deg * var(--qw)));
        }
    </style>

<script type="text/javascript">
    var root = document.documentElement;
    document.addEventListener("mousemove", function (e) {
        var x = e.clientX / innerWidth;
        var y = e.clientY / innerHeight;
        // 自定义css变量
        root.style.setProperty("--qw", y);
        document.getElementById("beard").style.color = "rgba(" + Math.floor(255 * x) + "," + 0 + "," + 140 + ",1)";
    })
</script>

Object.setPrototypeOf()

为现有对象设置原型，返回一个新对象
接收两个参数：第一个是现有对象，第二是原型对象。

new 命令通过构造函数新建对象实例的过程，其本质是将实例的原型，指向了构造函数的prototype属性，然后在实例上执行构造函数。

//构造函数
function Person(name) {
    this.name = name;
}

var p = new Person("aaa");
//等同于将构造函数的原型对象赋给实例对象p的属性__proto__
p.__proto__ = Object.setPrototypeOf({},Person.prototype);
Person.call(p,"bbb");

这样实例的属性proto就指向了构造函数的原型，这样就形成了原型链，当在实例中找不到属性或方法时，就通过原型链进行查找。
在实例中执行构造函数，构造函数就是一个普通函数，如果一个普通函数在一个对象中被执行了，那么this就是该实例。比如

var o = {};
function Person(name) {
    this.name = name;
}
//把构造函数放在对象o中执行，那么这个this就是o对象了，执行完后，该o对象就有了实例属性name了。
Person.call(o,"aaa");