JavaScript崩溃指南：你遇到过这些异常吗？

今天让我们逐一详细罗列一下JavaScript的这些的错误类型，

1. EvalError（eval错误）：

   • EvalError ，通常用于表示与 eval() 函数相关的错误。eval() 函数用于在运行时执行动态生成的 JavaScript 代码。

   try {
       eval("alert('Hello, World!');");
   } catch (e) {
       console.error(e); 
   }
   
   

2. RangeError（范围错误）：

   • RangeError 表示一个值不在有效范围内的错误，通常涉及到数值超出了 JavaScript 的限制或范围。

   try {
       const arr = new Array(Infinity);
   } catch (e) {
       console.error(e); 
   }
   
   

3. ReferenceError（引用错误）：

   • ReferenceError 表示尝试引用未定义的变量或对象的错误。

   try {
       console.log(undefinedVariable);
   } catch (e) {
       console.error(e); 
   }
   
   

4. TypeError（类型错误）：

   • TypeError 表示尝试在不支持的数据类型上执行操作或使用不允许的方法的错误。

   try {
       const number = 42;
       number.toUpperCase();
   } catch (e) {
       console.error(e); 
   }
   
   

5. URIError（URI错误）：

   • URIError 表示与 URI 相关的错误，通常涉及到对 URI 进行不正确的操作。

   try {
       decodeURIComponent('%');
   } catch (e) {
       console.error(e); 
   }
   
   

6. SyntaxError（语法错误）：

   • SyntaxError 表示代码包含语法错误，导致解析失败。这个错误类型通常由 JavaScript 引擎报告，WebIDL 中故意省略以保留给 ES 解析器使用。

   try {
       if (x > 10 {  
           
       }
   } catch (e) {
       console.error(e);
   }
   
   

7. Error（通用错误）：

   • Error 是一个通用的错误类型，通常被用于创建自定义错误对象。

   try {
       throw new Error('This is a custom error.');
   } catch (e) {
       console.error(e); 
   }
   
   

8. IndexSizeError（索引不在允许的范围内）：

   • IndexSizeError 表示尝试使用不在允许范围内的索引值的错误。

   try {
       const arr = [1, 2, 3];
       const item = arr.item(10); 
   } catch (e) {
       console.error(e);
   }
   
   

9. HierarchyRequestError（节点树层次结构是不正确的）：

   • HierarchyRequestError 表示尝试操作 DOM 节点树中的节点时，导致树的层次结构不正确的错误。

   try {
       const parent = document.createElement('div');
       const child = document.createElement('div');
       child.appendChild(parent); 
   } catch (e) {
       console.error(e);
   }
   
   

10. InvalidCharacterError（字符串包含无效字符）：

*   `InvalidCharacterError` 表示尝试使用无效字符的字符串进行操作时的错误。

```javascript
try {
    const invalidString = '\x01\x02\x03'; 
    const element = document.createElement(invalidString); 
} catch (e) {
    console.error(e);
}

```

1. NoModificationAllowedError（对象不能被修改）：

*   `NoModificationAllowedError` 表示尝试修改不允许修改的对象时的错误。

```javascript
try {
    const inputElement = document.createElement('input');
    inputElement.setAttribute('type', 'text'); 
} catch (e) {
    console.error(e);
}

```

1. NotFoundError（对象不能在这里被找到）：

*   `NotFoundError` 表示尝试查找不存在的对象时的错误。

```javascript
try {
    const element = document.querySelector('.nonexistent'); 
} catch (e) {
    console.error(e);
}

```

1. NotSupportedError（不支持的操作）：

*   `NotSupportedError` 表示尝试执行不被当前环境或对象支持的操作时的错误。

```javascript
try {
    navigator.vibrate([200, 100, 200]); 
} catch (e) {
    console.error(e); 
}

```

1. InvalidStateError（对象是一个无效的状态）：

*   `InvalidStateError` 表示尝试在对象处于无效状态时执行操作的错误。

```javascript
try {
    const audioElement = document.createElement('audio');
    audioElement.play(); 
} catch (e) {
    console.error(e); 
}

```

1. SyntaxError（字符串不匹配预期的模式）：

*   `SyntaxError` 表示尝试使用不符合预期模式的字符串时的错误。

```javascript
try {
    JSON.parse("{'name': 'John'}"); 
} catch (e) {
    console.error(e); 
}

```

1. InvalidModificationError（对象不能以这种方式被修改）：

*   `InvalidModificationError` 表示尝试以不允许的方式修改对象时的错误。

```javascript
try {
    const inputElement = document.createElement('input');
    inputElement.setAttribute('type', 'password'); 
} catch (e) {
    console.error(e); 
}

```

1. NamespaceError（操作在 XML 命名空间内不被允许）：

*   `NamespaceError` 表示尝试在 XML 命名空间内执行不允许的操作时的错误。

```javascript
try {
    const xmlDocument = new DOMParser().parseFromString("<book></book>", "text/xml");
    const element = xmlDocument.createElement("author"); 
} catch (e) {
    console.error(e); 
}

```

1. InvalidAccessError（对象不支持这种操作或参数）：

*   `InvalidAccessError` 表示尝试使用不支持的操作或参数访问对象时的错误。

```javascript
try {
    const canvas = document.createElement('canvas');
    canvas.getContext('webgl', { antialias: true }); 
} catch (e) {
    console.error(e); 
}

```

1. TypeMismatchError（对象的类型不匹配预期的类型）：

*   `TypeMismatchError` 表示尝试将对象分配给不兼容的类型或参数时的错误。

```javascript
try {
    const inputElement = document.createElement('input');
    inputElement.value = {}; 
} catch (e) {
    console.error(e); 
}

```

1. SecurityError（此操作是不安全的）：

*   `SecurityError` 表示尝试执行被浏览器安全策略限制的不安全操作时的错误。

```javascript
try {
    const iframe = document.createElement('iframe');
    iframe.src = 'http://example.com'; 
} catch (e) {
    console.error(e); 
}

```

1. NetworkError（发生网络错误）：

*   `NetworkError` 表示尝试执行网络请求或操作时发生的网络相关错误。

```javascript
const xhr = new XMLHttpRequest();
xhr.open('GET', 'http://example.com/api/data', true);
xhr.send();
xhr.onerror = function () {
    console.error('NetworkError:', xhr.statusText); 
};

```

1. AbortError（操作被中止）：

*   `AbortError` 表示尝试中止正在进行的操作时的错误。

```javascript
const xhr = new XMLHttpRequest();
xhr.open('GET', 'http://example.com/api/data', true);
xhr.send();
xhr.abort();
xhr.onerror = function () {
    console.error('AbortError:', xhr.statusText); 
};

```

1. URLMismatchError（给定的 URL 不匹配另一个 URL）：

*   `URLMismatchError` 表示尝试将一个 URL 与另一个 URL 进行比较，但它们不匹配时的错误。

```javascript
const url1 = new URL('http://example.com');
const url2 = new URL('http://example.org');
if (url1.href !== url2.href) {
    console.error('URLMismatchError: URLs do not match.'); 
}

```

1. QuotaExceededError（已经超过给定配额）：

*   `QuotaExceededError` 表示尝试在已达到或超过了指定配额时执行某些操作的错误。

```javascript
try {
    localStorage.setItem('key', 'value'); 
} catch (e) {
    console.error(e); 
}

```

1. TimeoutError（操作超时）：

*   `TimeoutError` 表示尝试执行的操作在超过指定的时间限制后仍未完成的错误。

```javascript
const xhr = new XMLHttpRequest();
xhr.open('GET', 'http://example.com/api/slow', true);
xhr.timeout = 5000; 
xhr.ontimeout = function () {
    console.error('TimeoutError: The operation timed out.'); 
};
xhr.send();

```

1. InvalidNodeTypeError（这个操作的节点或节点祖先是不正确的）：

*   `InvalidNodeTypeError` 表示尝试执行操作的节点或节点祖先类型不正确的错误。

```javascript
try {
    const textNode = document.createTextNode('Text');
    textNode.appendChild(document.createElement('div')); 
} catch (e) {
    console.error(e); 
}

```

1. DataCloneError（对象不能克隆）：

*   `DataCloneError` 表示尝试克隆对象失败的错误，通常在 Web Workers 等环境中使用。

```javascript
try {
    const worker = new Worker('worker.js');
    worker.postMessage({ complexObject: new Int32Array(10) }, [new Int32Array(10).buffer]); 
} catch (e) {
    console.error(e); 
}
``




```

关于JavaScript学习过程中的一些学习笔记、总结、思考、技巧，以及学习心得

作者-zayyo