js 错误捕获

博客分类: 江河计划
JavaScript (120)

js 错误捕获

JavaScript (120)

算法

集合

class Set{
    private items: any = {};
    private length: number = 0;
    add(value:any):boolean{
        if(!this.has(value)){
            this.items[value] = value;
            ++this.length;
            return true;
        }
        return false;
    }
    remove(value:any):boolean{
        if(this.has(value)){
            delete this.items[value];
            --this.length;
            return true;
        }
        return false;
    }
    has(value:any):boolean{
        return this.items.hasOwnProperty(value)
    }
    clear(){
        this.items = {};
        this.length = 0;
    }
    size():number{
        return this.length;
    }
    values():any[]{
        return Object.keys(this.items).map(item => {
            return this.items[item];
        });
    }
    union(set:Set):any[]{
        var arr = this.values();
        set.values().map(item => {
            if(!this.has(item)){
                arr.push(item);
            }
        });
        return arr;
    }
    intersectionSet(set:Set):any[]{
        var arr = [];
        set.values().map(item => {
            if(this.has(item)){
               arr.push(item);
            }
        });
        return arr;
    }
    difference(set:Set):any[]{
        var arr = [];
        this.values().map(item => {
            if(!set.has(item)){
                arr.push(item);
            }
        });
        return arr;
    }
    subset(set:Set):boolean{
        return !this.values().some(item => {
            if(!set.has(item)){
                return true;
            }
        });
    }
}
var set = new Set();
set.add(1);
console.log(set.values());
console.log(set.has(1));
console.log(set.size());
set.add(2);
console.log(set.values());
set.add(1);
console.log(set.values());
set.remove(1);
console.log(set.values());
set.remove(2);
console.log(set.values());

var set1 = new Set();
set1.add(1);
set1.add(2);
var set2 = new Set();
set2.add(2);
set2.add(3);
var set3 = new Set();
set3.add(2);
console.log(set1.union(set2))
console.log(set1.intersectionSet(set2))
console.log(set1.difference(set2))
console.log(set2.difference(set1))
console.log(set2.subset(set1))
console.log(set3.subset(set1))

字典

class Dictionary{
    private items: any = {};
    private length: number = 0;
    set(key:string, value:any):boolean{
        if(!this.has(key)){
            this.items[key] = value;
            ++this.length;
            return true;
        }
        return false;
    }
    remove(key:string):boolean{
        if(this.has(key)){
            delete this.items[key];
            --this.length;
            return true;
        }
        return false;
    }
    has(key:string):boolean{
        return this.items.hasOwnProperty(key)
    }
    get(key:string):any{
        if(this.has(key)){
            return this.items[key]
        }
        return undefined;
    }
    clear(){
        this.items = {};
        this.length = 0;
    }
    size():number{
        return this.length;
    }
    keys():string[]{
        return Object.keys(this.items);
    }
    values():any[]{
        return Object.keys(this.items).map(item => {
            return this.items[item];
        });
    }
}
var dictionary = new Dictionary();
dictionary.set('aaa', 111);
console.log(dictionary.values());
dictionary.set('bbb', 222);
console.log(dictionary.values());
dictionary.set('ccc', 333);
console.log(dictionary.values());
console.log(dictionary.has('aaa'));
console.log(dictionary.get('aaa'));
console.log(dictionary.size());
console.log(dictionary.keys());
dictionary.remove('aaa');
console.log(dictionary.values());
dictionary.remove('ccc');
console.log(dictionary.values());

错误处理

try-catch

在 js 中报错之后就会停止执行后续代码，使用 try-catch 一方面能捕获到错误，另一方面能使后面的代码继续执行。

try{
    // 可能会出错的代码
}catch(error){
    // error 错误对象
    // 错误处理信息
}finally{
    // 不管错误还是正确都会执行
}

错误类型

可以判断错误属于上述哪个错误的实例。也可以通过抛出错误来对代码进行监控。 (throw new 上述错误类型)

捕获全局错误

通过全局捕获错误，可以对错误进行上报，帮助面对前端的系统的稳定性，让自己的代码没有 error，是一个工程师对前端的最低要求。

window.onerror = function(message, url, line){
    // 通过此方法来捕获错误
}

单纯的记录错误是没用的，需要将导致错误的用户行为连贯起来，能复原用户的报错行为路径，将错误复现并解决。通过对请求的统一记录来标识请求行为，重写 console.log 对记录日志进行上传，将这些行为维护到堆栈中，出现报错时统一上传。