2020-09-09 题目来源：http://www.h-camel.com/index.html

[html] 说说你对H5的SharedWorker的理解，它有什么运用场景？

Worker SharedWorker 是HTML5为我们提供的多线程的实现机制。解决问题：如果js花费较长时间来处理一件事，那么浏览器这段时间将不会对用户产生响应。

看看这个主线程调用多个子线程的例子：主线程要完成一个任务需要两个线程，它创建了两个线程worker1,2,先向worker1请求，得到返回的数据后，再请求worker2,同时将worker1处理之后的数据交给worder2处理，然后拿到最终结果，显示在页面上。

onmessage事件：当通过事件源接收消息时，会触发。

<body>
    <div id="out"></div>
    <input type="text" name="" id="txt">
    <button id="btn">发送</button>
    <script type="text/javascript">

        var out = document.getElementById("out");
        var btn = document.getElementById("btn");
        var txt = document.getElementById("txt");
        var worker1 = new Worker("thread1.js");
        var worker2 = new Worker("thread2.js");
        btn.addEventListener("click",function(){
            var postData = txt.value;
            worker1.postMessage(postData);
        },false);
        worker1.addEventListener('message',function(e){
            worker2.postMessage(e.data);

        },false);
        worker2.addEventListener('message',function(e){
            out.innerText = e.data;
        },false);
    </script>
</body>

//thread1.js
onmessage = function(event){
    var res = event.data+"帅气！";
        postMessage(res);    
}

//thread2.js
onmessage = function(event){
    var res = event.data+"没骗你哟！";
    postMessage(res);
    close();
}

转自 https://blog.csdn.net/zdy0_2004/article/details/70199241

[css] 使用css3动画代替js的动画有什么好处？

优点是：

1.不占用js的主线程

2.可以利用硬件加速

3.浏览器可以对动画做优化

缺点是：浏览器对渲染的批量异步化处理让动画难以控制，此时可以强制同步。

$.fn.repaint = function () {
    this.each(function (item) {
        return item.clientHeight;
    });  
}

摘自 https://www.cnblogs.com/maopengyu/p/3587544.html

[js] 实现一个寄生式组合继承

核心：通过寄生方式，砍掉父类的实例属性，这样，在调用两次父类的构造的时候，就不会初始化两次实例方法/属性，避免组合继承缺点。

场景： 实现基于类型继承的最有效的方式
基本模式：
function inheritPrototype(subType, superType) {
    var prototype = object(superType.prototype); //创建对象
    prototype.constructor = subType; //增强对象
    subType.prototype = prototype; //指定对象
}
<script>

    function SuperType(name) {
        this.name = name;
        this.color = ["red", "green"];
    }
    SuperType.prototype.sayName = function() {alert(this.name);}

    function SubType(name, age) {
        //继承SuperType的属性
        SuperType.call(this, name);
        this.age = age;
    }
    inheritPrototype(SubType, SuperType);
    SubType.prototype.sayAge = function() {alert(this.age);}

</script>

[软技能] 如果让你空降去管理团队，你如何让团队成员信服？

i am not a leader, i am just a poor programmer

2020-09-09 html的sharedworker应用场景 + css的动画代替js动画有什么好处 + JS的寄生式组合继承 + 软技能的空降管理团队

2020-09-09 题目来源：http://www.h-camel.com/index.html

[html] 说说你对H5的SharedWorker的理解，它有什么运用场景？

[css] 使用css3动画代替js的动画有什么好处？

[js] 实现一个寄生式组合继承

[软技能] 如果让你空降去管理团队，你如何让团队成员信服？

猜你喜欢