开发者最容易犯的13个JavaScript错误
- 格式:doc
- 大小:51.50 KB
- 文档页数:8
JavaScript 使用误区目录1、比较运算符常见错误 (2)2、赋值运算符应用错误 (2)3、加法与连接注意事项 (3)4、浮点型数据使用注意事项 (3)5、错误的使用分号 (4)6、JavaScript 字符串分行 (4)7、return 语句使用注意事项 (4)8、数组中使用名字来索引 (5)9、定义数组元素,最后不能添加逗号 (5)10、定义对象,最后不能添加逗号 (5)11、Undefined 不是 Null (6)12、程序块作用域 (6)1、比较运算符常见错误在常规的比较中,数据类型是被忽略的,以下 if 条件语句返回true:在严格的比较运算中,=== 为恒等计算符,同时检查表达式的值与类型,以下 if 条件语句返回 false:2、赋值运算符应用错误在 JavaScript 程序中如果你在 if 条件语句中使用赋值运算符的等号 (=) 将会产生一个错误结果, 正确的方法是使用比较运算符的两个等号 (==)。
if 条件语句返回false (是我们预期的)因为 x 不等于 10:if 条件语句返回true (不是我们预期的)因为条件语句执行为 x 赋值 10,10 为 true:if 条件语句返回false (不是我们预期的)因为条件语句执行为 x 赋值 0,0 为 false:3、加法与连接注意事项加法是两个数字相加。
连接是两个字符串连接。
JavaScript 的加法和连接都使用 + 运算符。
接下来我们可以通过实例查看两个数字相加及数字与字符串连接的区别:4、浮点型数据使用注意事项JavaScript 中的所有数据都是以 64 位浮点型数据(float) 来存储。
所有的编程语言,包括 JavaScript,对浮点型数据的精确度都很难确定:为解决以上问题,可以用整数的乘除法来解决:5、错误的使用分号以下实例中,if 语句失去方法体,原 if 语句的方法体作为独立的代码块被执行,导致错误的输出结果。
开发者最容易犯的13个JavaScript错误开发者最容易犯的JavaScript错误,总结出13个。
这些当中可能少不了你犯的错误。
我们描述了这些陋习,并列出来解决办法,希望对开发者有帮助。
1.for..in数组迭代的用法Usage of for..in to iterate Arrays举例:var myArray = [ “a”, “b”, “c” ];var totalElements = myArray.length;for (var i = 0; i <totalElements; i++) {console.log(myArray[i]);}不能保证顺序,这意味着这里主要的问题是语句中的“for..in”你将获得不同的执行结果。
此外,如果有人增加一些其他自定义功能的函数Array.prototype,你的循环将重复遍历这些函数,就像原数组项。
解决办法:一直使用规则的for..in循环来遍历数组。
var myArray = [ “a”, “b”, “c” ];for (var i=0; i<myArray.length; i++) {console.log(myArray[i]);}2.Array dimensions举例var myArray = new Array(10);第二个问题是开发者使用数组构成器来创建数组,技术上是正确的,然而会比文字符号(literal notation)。
解决办法:使用文字符号来初始化数组,不要预定义数组长度。
var myArray = [];3.Undefined properties举例:var myObject = {someProperty: “value”,someOtherProperty: undefined}未定义属性,将在对象中创建元素(键‘someOtherProperty’和)。
如果你遍历数组,检测已存在的元素,那么下值‘undefined’.面的语句将都返回“未定义/undefined”typeof myObject['someOtherProperty'] // undefinedtypeof myObject['unknownProperty'] // undefined解决办法:如果你想明确声明对象中的未初始化的属性,标记它们为Null。
JS错误(JavaScript错误)是在使用JavaScript编程语言时可能会遇到的问题。
由于JavaScript是一种广泛应用于网页开发的脚本语言,因此对JS错误的理解和处理至关重要。
1. 了解JS错误JS错误是指在运行JavaScript代码时发生的错误。
它们可能是语法错误、逻辑错误或运行时错误。
常见的JS错误包括语法错误(SyntaxError)、引用错误(ReferenceError)、类型错误(TypeError)等。
2. JS错误的影响JS错误对网页的影响非常大。
如果未能处理好JS错误,可能会导致网页无法正常运行,甚至直接崩溃。
用户体验将因此受到影响,甚至会导致用户流失。
3. 处理JS错误的方法处理JS错误的方法主要包括使用try-catch语句进行错误捕获、使用console对象进行错误记录和调试、使用第三方工具进行错误监控和上报等。
合理的错误处理方法可以使网页更加健壮。
4. 个人观点和理解在我看来,对JS错误的理解和处理至关重要。
作为网页开发者,我们应该注重代码质量,尤其是对可能产生JS错误的地方要特别注意。
合理的错误处理不仅可以提升用户体验,还可以减少不必要的维护成本。
总结回顾:通过本文的全面介绍,我对JS错误有了更加深刻的理解。
了解了JS错误的类型和影响,学习了处理JS错误的方法,并且了解了应对JS错误的重要性。
我相信在将来的网页开发中,能够更好地处理和避免JS错误,提升网页的健壮性和稳定性。
接下来,我会继续深入学习和实践,希望能够在网页开发中游刃有余地处理JS错误,为用户提供更好的网页体验。
JavaScript错误(JS错误)在网页开发中是一个非常普遍的问题,了解并处理好这些错误对于提升用户体验和网页稳定性非常重要。
在这篇文章中,我们通过介绍了JS错误的类型、影响以及处理方法,对JS错误有了更加深入的理解。
接下来,我们将进一步扩展对JS错误的认识,并探讨一些更加具体的处理方法和案例分析。
编程初学者的十个常见错误及如何避免编程是一项需要刻苦学习和实践的技能,初学者常常会犯一些常见的错误。
这些错误可能会导致程序无法正常运行,或者产生错误的结果。
在接下来的文章中,我们将讨论十个常见的编程错误,并提供一些解决方法,以帮助初学者避免这些错误。
1.语法错误语法错误是编程中最常见的错误之一,它们在编译或解释代码时会导致语法分析器报错。
这些错误包括拼写错误、缺失的逗号或分号,或者不正确的代码结构。
为了避免这些错误,初学者需要仔细检查他们的代码并了解编程语言的语法规则。
此外,使用集成开发环境(IDE)可以帮助自动检测这些错误。
2.拼写错误拼写错误是另一个常见的错误。
在编写代码时,初学者可能会犯常见的拼写错误,如将变量名称拼写错误或者忽略大小写。
为了避免这些错误,建议初学者仔细检查他们的代码,并使用有意义的变量和函数名称,以减少拼写错误的可能性。
3.访问超出数组范围当初学者使用数组时,他们可能会尝试访问超出数组边界的索引。
这种错误可能会导致程序崩溃或产生错误的结果。
为了避免这些错误,初学者需要注意数组的大小,并确保他们访问的索引在有效范围内。
4.不正确的变量作用域变量的作用域是指变量在代码中可见的范围。
当初学者在不了解变量作用域规则的情况下使用变量时,他们可能会犯错误。
例如,在一个循环中声明一个变量,并尝试在循环外部访问它。
为了避免这些错误,初学者需要理解变量作用域的概念,并正确地声明和使用变量。
5.逻辑错误逻辑错误是编程中最难调试和解决的错误之一。
它们发生在程序的逻辑或条件判断中,导致程序产生错误的结果。
为了避免这些错误,初学者应该仔细检查他们的逻辑以及条件判断,并使用调试工具来找出问题所在。
6.死循环死循环是一种无限循环,程序无法跳出循环而终止。
这通常是由于程序员在循环条件中使用了错误的判断条件或错误的循环终止条件引起的。
为了避免死循环,初学者需要确保他们在循环条件中使用正确的判断条件,并在必要时正确地更新循环计数器,以确保循环会终止。
JavaScript编程的常见问题及解决方法JavaScript编程是现代Web开发中的重要组成部分。
然而,就像任何其他编程语言一样,JavaScript也会遇到一些常见问题。
在本文中,我将详细介绍一些常见的JavaScript编程问题及其解决方法。
1. 问题:变量未定义解决方法:在使用变量之前,始终使用var、let或const关键字声明变量。
这样可以确保变量在使用之前已经被定义,避免未定义的错误。
2. 问题:作用域问题解决方法:熟悉JavaScript中的作用域规则。
确保你在正确的作用域中声明和使用变量。
避免变量污染和意外的覆盖。
3. 问题:同步和异步操作解决方法:理解JavaScript的事件循环机制。
异步操作可以使用回调函数、Promise对象或async/await语法来处理。
避免使用同步操作阻塞UI线程。
4. 问题:类型转换错误解决方法:注意JavaScript中的类型转换规则。
使用合适的函数将变量转换为所需的类型,例如parseInt()、parseFloat()、Number()、String()等。
5. 问题:DOM操作问题解决方法:对于复杂的DOM操作,使用现代的DOM库,如jQuery或React 等。
避免直接操作DOM,尽量使用虚拟DOM等高级技术来进行性能优化。
6. 问题:内存泄漏解决方法:避免循环引用和长期持有不再使用的对象。
在合适的时机手动释放资源,如移除事件监听器、清除定时器等。
7. 问题:错误处理解决方法:使用try...catch语句捕获和处理异常。
在开发过程中添加适当的错误处理机制,以便及时发现和解决问题。
8. 问题:性能问题解决方法:使用性能优化工具,如Chrome开发者工具,分析和改进代码性能。
避免使用不必要的循环和重复操作。
9. 问题:跨浏览器兼容性解决方法:检查代码在不同浏览器中的兼容性,使用适当的polyfill或垫片来解决问题。
尽量遵循Web标准,减少浏览器兼容性的难题。
简单聊聊Js中的常见错误类型⽬录前⾔JavaScript中的错误类型ErrorEvalErrorRangeErrorReferenceErrorSyntaxErrorTypeErrorURIError总结前⾔js在开发过程经常会遇到各种各样的报错,那么你了解这些错误产⽣的原因吗?下⾯跟我⼀起认识这⼏种常见的错误类型吧JavaScript中的错误类型ErrorEvalErrorRangeErrorReferenceErrorSyntaxErrorTypeErrorURIErrorErrorError是最基本的错误类型,其他的错误类型都继承⾃该类型。
因此,所有错误的类型共享了⼀组相同的属性。
这个类型的错误很少见。
⼀般使⽤开发⼈员⾃定义抛出的错误。
EvalError这个错误会在使⽤eval()函数发⽣异常时候抛出。
两种情况会出错:new eval();eval = foo;上⾯两个的意思结合就是没有直接调⽤eval函数,⽽是new或者是重新赋值这个错误基本上不会遇到,因为eval函数本来⽤的就不多。
不过需要注意的是,eval是⼀个关键字。
RangeError这个错误会在数值超出相应范围时触发。
⽐如使⽤new Array()的时候传递⼀个负数或者是超过数组最⼤长度(4,294,967,295)的数,⽐如Number.MAX_VALUE,Number.MIN_VALUE。
注意递归爆炸也有这个错误。
RangeError:范围错误RangeError是当⼀个只超出有效范围时发⽣的错误。
主要的有⼏种情况,第⼀是数组长度为负数,第⼆是Number对象的⽅法参数超出范围,以及函数堆栈超过最⼤值。
// 3.RangeError:范围错误// 3.1 数组长度为负数[].length = -5 // Uncaught RangeError: Invalid array length// 3.2 Number对象的⽅法参数超出范围var num = new Number(12.34)console.log(num.toFixed(-1))// Uncaught RangeError: toFixed() digits argument must be between 0 and 20 at Number.toFixed// 说明: toFixed⽅法的作⽤是将数字四舍五⼊为指定⼩数位数的数字,参数是规定⼩数的位数,是 0 ~ 20 之间的值,包括 0 和 20,有些实现可以⽀持更⼤的数值范围。
JavaScript中的错误调试错误调试是软件开发中不可或缺的一部分,它帮助开发人员找到和解决应用程序中的错误。
而在JavaScript开发中,错误调试也非常重要。
本文将介绍一些常见的JavaScript错误和错误调试技巧。
一、常见的JavaScript错误1. 语法错误(Syntax Errors)语法错误是在代码编写过程中最常见的错误之一。
这些错误通常是由于拼写错误、缺少分号、括号不匹配等引起的。
```例子:let x = 5;console.log(x```上述代码中,缺少了一个右括号,会导致语法错误。
2. 类型错误(Type Errors)类型错误通常发生在应用程序试图使用一个错误类型的值时。
这可能是由于变量类型与操作不匹配、函数的参数类型错误等引起的。
```例子:let x = 5;console.log(x.toUpperCase());```上述代码中,使用了字符串的方法toUpperCase(),而变量x的类型为数字,因此会引发类型错误。
3. 引用错误(Reference Errors)引用错误通常发生在应用程序试图访问一个不存在的变量、对象属性或函数时。
```例子:console.log(x);```上述代码中,变量x未被声明,因此会引发引用错误。
二、JavaScript错误调试技巧1. 使用浏览器开发工具现代的浏览器提供了开发者工具,其中包括调试功能。
通过在浏览器中打开开发者工具,可以查看代码运行时的错误信息、断点调试、单步执行等。
常见的浏览器开发工具有Chrome DevTools、Firefox Developer Tools等。
2. 使用console.log()进行输出调试console.log()是一种简单有效的调试方法,在关键位置插入console.log()语句,输出变量的值,以便观察程序的执行状态和变量的取值。
这种方法可以用于定位问题所在,并辅助分析错误。
3. 使用断点调试断点调试是一种高级的调试技术,可以在开发工具中设置断点,使程序在特定位置停止执行,并允许开发人员逐步调试代码。
前端开发中常见的错误及解决方法前端开发是构建网页、网站和移动应用等用户界面的过程,它的主要任务是将设计师设计好的页面转化为代码,并实现交互效果。
然而,在开发过程中,常常会遇到各种各样的错误。
本文将探讨一些前端开发中常见的错误以及解决方法。
一、语法错误语法错误是编程中最常见的错误之一。
当我们在编写HTML、CSS或JavaScript代码时,经常会忽略一些细节导致语法错误。
例如,缺少闭合标签、缺少分号或使用错误的语法结构等。
要解决语法错误,我们可以使用代码编辑器的语法检查工具。
例如,Sublime Text和Visual Studio Code等编辑器都内置了实时语法检查和错误提示功能。
此外,我们还可以借助浏览器的开发者工具,在控制台中查看错误信息并进行调试。
二、浏览器兼容性问题不同的浏览器对网页的渲染方式存在差异,这就导致了浏览器兼容性问题。
例如,某些CSS属性在某些浏览器中不被支持或表现不一致。
为了解决这个问题,我们需要使用CSS前缀和媒体查询等技术来处理不同浏览器的差异。
同时,还可以通过JavaScript检测浏览器类型并采取相应的兼容性措施。
此外,可以借助CSS框架如Bootstrap等来简化兼容性处理。
三、页面加载速度慢当网页加载速度过慢时,用户体验就会变差,甚至可能导致用户流失。
页面加载速度慢的原因可能是代码冗余、图片过大、服务器响应时间慢等。
为了加快页面加载速度,我们可以使用压缩和合并代码的方式减少请求次数和文件大小。
此外,优化图片大小和格式也能显著缩短加载时间。
使用CDN(内容分发网络)可以将静态资源分布在全球各地的服务器,提高访问速度。
最重要的是,需要对服务器进行优化,确保其能够快速响应请求。
四、响应式设计问题随着移动设备的普及,响应式设计已经成为前端开发的重要趋势。
然而,实现一个良好的响应式设计并不容易。
常见的问题包括布局错乱、字体大小不合适和交互不友好等。
要解决响应式设计问题,我们需要使用流式布局(Fluid Layout)和媒体查询(Media Queries)来适应不同的屏幕尺寸。
10个最常见的JavaScript错误(以及如何避免它们)-来自Rollbar1000...为了回馈我们的开发者社区,我们查看了数千个项目的数据库,发现了JavaScript 的10 大错误。
我们将向你展示这些错误的原因,以及如何防止这些错误发生。
如果你避免了这些“陷阱” ,这将使你成为一个更好的开发人员。
由于数据是国王,我们收集,分析并排名前十的 JavaScript 错误。
Rollbar 会收集每个项目的所有错误,并总结每个项目发生的次数。
我们根据指纹对错误进行分组,来做到这一点。
基本上,如果第二个错误只是第一个错误的重复,我们会把两个错误分到同一组。
这给用户一个很好的概括,而不是像在日志文件中看到的那些压迫性的一大堆垃圾描述。
我们专注于最有可能影响你和你的用户的错误。
为此,我们通过横跨不同公司的项目数来排列错误。
如果我们只查看每个错误发生的总次数,那么大流量的项目可能会淹没与大多数读者无关的错误的数据集。
以下是排名前10 的JavaScript 错误:为了便于阅读,没有花大段的文字来描述每个错误。
让我们深入到每一个错误,来确定什么可以导致它,以及如何避免它发生。
1.Uncaught TypeError: Cannot read property如果你是一个JavaScript 开发人员,你可能已经看到这个错误的次数比你敢承认的要多。
当你读取一个属性或调用一个未定义的对象的方法时,这个错误会在 Chrome 中发生。
你可以在 Chrome 开发者工具的控制台中轻松测试。
发生这种情况的原因很多,但常见的一种情况是在渲染UI组件时不恰当地初始化了 state(状态)。
我们来看一个在真实应用程序中如何发生的例子。
我们将选择React,但不正确初始化的原则也适用于Angular,Vue或任何其他框架。
JavaScript 代码:1.classQuizextendsComponent{ponentWillMount() {3.axios.get('/thedata').then(res => {4.this.setState({items: res.data});5.});6.}7.8.render() {9.return(10.<ul>11.{this.state.items.map(item =>12.<li key={item.id}>{}</li>13.)}14.</ul>15.);16.}17.}这里有两件重要的事情要实现:1.组件的状态(例如 this.state)从 undefined 开始。
js的各种错误类型1.SyntaxError(语法错误)解析代码时发生的语法错误eg:var 1a;Uncaught SyntaxError: Unexpected number2.ReferenceError(引用错误)a.引用了一个不存在的变量eg: console.log(a);Uncaught ReferenceError: a is not definedb.将变量赋值给一个无法被赋值的对象eg:console.log()= 1;Uncaught ReferenceError: Invalid left-hand side in assignment3.RangeError(范围错误)超出有效范围eg:var a= new Array(-1);Uncaught RangeError: Invalid array length4.TypeError(类型错误)a.变量或参数不是预期类型,比如,对字符串、布尔值、数值等原始类型的值使用new命令,就会抛出这种错误,因为new命令的参数应该是一个构造函数。
eg: var a= new 123;Uncaught TypeError: 123 is not a functionb.调用对象不存在的方法eg:vara;a.aa();Uncaught TypeError: Cannot read property 'aa' of undefined5.URLError(URL错误)与url相关函数参数不正确,主要是encodeURI()、decodeURI()、encodeURIComponent()、decodeURIComponent()、escape()和unescape()这六个函数。
eg: decodeURI('%2')Uncaught URIError: URI malformed6.EvalError(eval错误)eval函数没有被正确执行//复习一:var a = 10;function pay() {a -= 3;console.log(a);}pay(a);//a的结果console.log(a);//a的结果//变形题:var b = 10;function pay(b) {b -= 3;console.log(b);}pay(b);//b的结果console.log(b);//b的结果//复习2:var c = 100;function fn() { console.log(c); var c = 10; console.log(c); }fn(c); console.log(c); //复习2变形var d = 100; function fn(d) { console.log(d); var d = 10; console.log(d); }fn(d); console.log(d); //复习2变形var e = 100; function fn(e) { console.log(e); let e = 10; console.log(e);}fn(e);console.log(e);//复习2变形var g = 100;function fn() {console.log(g);let g = 10;console.log(g);}fn(g);console.log(e);//for循环分号的问题:计算0到10之间的数的和for (var i= 0, sum = 0; i<= 10; sum += i, i++) console.log(sum)。
开发者最容易犯的13个JavaScript错误开发者最容易犯的JavaScript错误,总结出13个。
这些当中可能少不了你犯的错误^_^。
我们描述了这些陋习,并列出来解决办法,希望对开发者有帮助。
1.for.. 数组迭代的用法Usage of for..in to iterate Arrays举例:var myArray = [ “a”, “b”, “c” ];var totalElements = myArray.length;for (var i = 0; i < totalElements; i++) {console.log(myArray[i]);}这里主要的问题是语句中的“for..."不能保证顺序,这意味着你将获得不同的执行结果。
此外,如果有人增加一些其他自定义功能的函数Array.prototype,你的循环将重复遍历这些函数,就像原数组项。
解决办法:一直使用规则的for循环来遍历数组。
var myArray = [ “a”, “b”, “c” ];for (var i=0; i<myArray.length; i++) {console.log(myArray[i]);}2. 数组维度Array dimensions举例var myArray = new Array(10);这里有两个不同的问题。
首先,开发者尝试创建一个包含10项的数组,这将创建10个空槽的阵列。
然而,如果你试图得到一数组项,你将得到”未定义“的结果。
换句话说,效果就像你没有保存内存空间。
没有真正的好原因来预定义数组长度。
第二个问题是开发者使用数组构成器来创建数组,技术上是正确的,然而会比文字符号(literal notation)慢解决办法:使用文字符号来初始化数组,不要预定义数组长度。
var myArray = [];3. 未定义属性Undefined properties举例:var myObject = {someProperty: “value”,someOtherProperty: undefined}未定义属性,将在对象中创建元素(键’someOtherProperty’和值‘undefined’.)。
如果你遍历数组,检测已存在的元素,那么下面的语句将都返回”未定义/undefined“typeof myObject['someOtherProperty'] // undefinedtypeof myObject['unknownProperty'] // undefined解决办法:如果你想明确声明对象中的未初始化的属性,标记它们为Null(空)。
var myObject = {someProperty: “value”,someOtherProperty: null}4. 闭包的滥用Misuse of Closures举例:function(a, b, c) {var d = 10;var element = document.getElementById(‘myID’);element.onclick = (function(a, b, c, d) {return function() {alert (a + b + c + d);}})(a, b, c, d);}这里开发者使用两个函数来传递参数a、b、c到onclick handler。
双函数根本不需要,徒增代码的复杂性。
变量abc已经在局部函数中被定义,因为他们已经在主函数中作为参数被声明。
局部函数中的任何函数都可创建主函数中定义的所有变量的闭包。
因此不需要再次传递它们。
看看这里 JavaScript Closures FAQ 了解更多。
解决办法:使用闭环来简化你的代码。
function (a, b, c) {var d = 10;var element = document.getElementById(‘myID’);element.onclick = function() {//a, b, and c come from the outer function arguments.//d come from the outer function variable declarations.//and all of them are in my closurealert (a + b + c + d);};}5. 循环中的闭包Closures in loops举例:var elements = document.getElementByTagName(‘div’);for (var i = 0; i<elements.length; i++) {elements[i].onclick = function() {alert(“Div number “ + i);}}在这里例子里面,当用户点击不同的divs时,我们想触发一个动作(显示“Div number 1”, “Div number 2”…等) 。
然而,如果你在页面有10个divs,他们全部都会显示“Div number 10”。
问题是当我们使用局部函数创建一个闭包时,函数中的代码可以访问变量i。
关键是函数内部i和函数外部i涉及同样的变量。
当我们的循环结束,i指向了值10,所以局部函数中的i的值将是10。
解决办法:使用第二函数来传递正确的值。
v ar elements = document.getElementsByTagName(‘div’);for (var i = 0; i<elements.length; i++) {elements[i].onclick = (function(idx) { //Outer functionreturn function() { //Inner functionalert(“Div number “ + idx);}})(i);}6. DOM对象的内测泄漏Memory leaks with DOM objects举例:function attachEvents() {var element = document.getElementById(‘myID’);element.onclick = function() {alert(“Element clicked”);}};attachEvents();该代码创建了一个引用循环。
变量元素包含函数的引用(归于onclick属性)。
同时,函数保持一个DOM元素的引用(提示函数内部可以访问元素,因为闭包。
)。
所以JavaScript 垃圾收集器不能清除元素或是函数,因为他们被相互引用。
大部分的JavaScript引擎对于清除循环应用都不够聪明。
解决办法:避免那些闭包,或者不去做函数内的循环引用。
function attachEvents() {var element = document.getElementById(‘myID’);element.onclick = function() {//Remove element, so function can be collected by GCdelete element;alert(“Element clicked”);}};attachEvents();7. 区别整数数字和浮点数字Differentiate float numbers frominteger numbers举例:var myNumber = 3.5;var myResult = 3.5 + 1.0; //We use .0 to keep the result as float在JavaScript中,浮点与整数间没有区别。
事实上,JavaScript中的每个数字都表示使用双精度64位格式IEEE 754。
简单理解,所有数字都是浮点。
解决办法:不要使用小数(decimals),转换数字(numbers)到浮点(floats)。
var myNumber = 3.5;var myResult = 3.5 + 1; //Result is 4.5, as expected8. with()作为快捷方式的用法Usage of with() as a shortcut举例:team.attackers.myWarrior = { attack: 1, speed: 3, magic: 5};with (team.attackers.myWarrior){console.log ( “Your warrior power is ” + (attack * speed));}讨论with()之前,要明白JavaScript contexts 如何工作的。
每个函数都有一个执行context(语句),简单来说,包括函数可以访问的所有的变量。
因此 context 包含 arguments 和定义变量。
with() 真正是做什么?是插入对象到 context 链,它在当前 context 和父级context间植入。
就像你看到的with()的快捷方式会非常慢。
解决办法:不要使用with() for shortcuts,仅for context injection,如果你确实需要时。
team.attackers.myWarrior = { attack: 1, speed: 3, magic: 5};var sc = team.attackers.myWarrior;console.log(“Your warrior power is ” + (sc.attack * sc.speed));9.setTimeout/setInterval 字符串的用法Usage of strings withsetTimeout/setInterval举例:function log1() { console.log(document.location); }function log2(arg) { console.log(arg); }var myValue = “test”;setTimeout(“log1()”, 100);setTimeout(“log2(” + myValue + “)”, 200);setTimeout() 和 setInterval() 可被或一个函数或一个字符串作为首个参数。
如果你传递一个字符串,引擎将创建一个新函数(使用函数构造器),这在一些浏览器中会非常慢。
相反,传递函数本身作为首个参数,更快、更强大、更干净。
解决办法:一定不要使用 strings for setTimeout() 或 setInterval()。