Code Monkey home page Code Monkey logo

odoe's Introduction

odoe's People

Contributors

homobulla avatar

Watchers

 avatar

odoe's Issues

20190510-002.md

const定义的常量真的无法更改吗?

先看一段代码:

const homo = {};

homo.bulla= 123;
homo.bulla // 123

homo= {}; // TypeError: Assignment to constant variable.

const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址不得改动。对于简单类型的数据(数值、字符串、布尔值),值就保存在变量指向的那个内存地址,因此等同于常量。

但对于复合类型的数据(主要是对象和数组),变量指向的内存地址,保存的只是一个指针,const只能保证这个指针是固定的,至于它指向的数据结构是不是可变的,就完全不能控制。

如何定义一个完全意义上的常量

const  obj = {a:1};
Object.freeze(obj)

答案是Object.freeze,对象一旦被冻结,则不能向这个对象添加新的属性,不能删除已有属性,不能修改该对象已有属性的可枚举性、可配置性、可写性,以及不能修改已有属性的值。即意味着也无法通过Object.defineProperty来修改。
但这样的冻结还是浅冻结,假如对象某个属性值依然是对象,那么我们依旧可以修改这个属性值,解决办法是用递归来冻结所有属性值为对象的属性。

var deepFreeze= (obj) => {
   Object.freeze(obj);
   Object.keys(obj).forEach( (key, i) => {
      if ( typeof obj[key] === 'object' ) {
        deepFreeze( obj[key] );
     }
   });
}

20190509-001.md

question

DOM 的体积过大会影响页面性能,假如你想在用户关闭页面时统计(计算并反馈给服务器)当前页面中元素节点的数量总和、多少种HTML标签种类、元素节点的最大嵌套深度以及最大子元素个数,请用 JS 配合原生 DOM API 实现该需求(不用考虑陈旧浏览器以及在现代浏览器中的兼容性,可以使用任意浏览器的最新特性;不用考虑 shadow DOM)。

 let maxChildrenCount = 0, // 元素节点的总和
     maxDOMTreeDepth = 0, //元素最大嵌套问题
     totalElementsCount = 1, //最大子元素
     totalDOMTypeCount = new Set([...document.getElementsByTagName("*")].map(x=>x.tagName)).size; //DOM种类
    function DFS(e, depth) {
        // 没有子节点了, 意味着 DFS 已经抵达一个叶节点, 更新深度计数器
        if (e.children.length === 0) {
            maxDOMTreeDepth = depth > maxDOMTreeDepth ? depth : maxDOMTreeDepth;
            return;
        }
        let stack = Array.from(e.children) 
        stack.forEach(n => {
            // 更新总标签数
            totalElementsCount += 1;
            // 更新最大子元素数
            if (stack.length > maxChildrenCount) maxChildrenCount = stack.length;
            DFS(n, depth + 1);
        });
    }
    DFS(document.querySelector("html"), 1);
    console.log({
        totalElementsCount,
        maxDOMTreeDepth,
        maxChildrenCount,
        totalDOMTypeCount 
    });

extend

如何获取页面中出现次数最多的元素及其出现次数?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.