[JS基础] 从window对象开始~

146 阅读1分钟

目录

  1. window 和 window.loacation
  2. 监听浏览器URL变化
  3. 对比两个版本号

0 window 和 window.loacation

image.png

image.png

Object.prototype.toString.call(window)
// '[object Window]'
typeof window
// 'object'
Object.keys(window);
Object.entries(window);

image.png

Object.keys(window.location)

image.png

一 监听浏览器URL变化

需要注意的是调用 history.pushState() history.replaceState() 用来在浏览历史中添加或修改记录。不会触发popstate事件只有在做出浏览器动作时,才会触发该事件,如用户点击浏览器的回退按钮(或者在Javascript代码中调用history.back()


window.addEventListener('hashchange',()=>{

},false);

window.addEventListener('popstate',()=>{

},false);

1) [代理模式] 重写 popstate

通过重写 popstate 事件. 从而解决 history.pushState() history.replaceState() 用来在浏览历史中添加或修改记录,不会触发popstate事件的问题.

二 对比两个版本号

对比 v1='1.1.1.2' 和 v2='1.1.2'

通过 continuebreak 减少循环次数,优化性能


function isStr(o){
    return Object.prototype.toString.call(o) === '[object String]';
};
function compare(v1, v2){
    if(!isStr(v1) && !isStr(v2)){return}
    let v1Arr = v1.split('.');
    let v2Arr = v2.split('.');
    let longArr = v1Arr.length > v2Arr.length ? v1Arr : v2Arr; // 遍历较长的数组
    let resStr='';
    for(let i=0; i<longArr.length; i++){
        let v1I = v1Arr[i]==null ? v1Arr[i]=0 : v1Arr[i]=v1Arr[i]; // v1和v2长度不一样时,补齐短串数组为0
        let v2I = v2Arr[i]==null ? v2Arr[i]=0 : v2Arr[i]=v2Arr[i];
        console.log('v1I:', v1I, 'v2I:', v2I);
        if(v1I > v2I){
            resStr = v1;
            break;
        }else if(v1I < v2I){
            resStr = v2
            break;
        }else{ // = 时
            continue;
        }
    }
    return resStr;
};
var v1='1.1.1.2.1.1.1.9';
var v2='1.1.2';
var v3='1.1.1.2.1.1.1';
var v4='1.1'
var v5='3.1'
compare(v4, v5);
// v1I: 1 v2I: 3
// '3.1'
compare(v1, v3);

image.png

参考

总结

  • 通过 continuebreak 减少循环次数,优化性能