javascript错误_避免这些常见JavaScript错误

javascript错误

Out of the many scripting languages, JavaScript is a great option for beginners to learn. However, this does not mean that it is an easy language or that you won’t make mistakes when writing code. In this article, I will cover some of the most common JavaScript mistakes that beginners make with the intention of helping you avoid them.

在许多脚本语言中,JavaScript是初学者学习的绝佳选择。 但是,这并不意味着它是一种简单的语言,也不意味着您在编写代码时不会犯错误。 在本文中,我将介绍初学者为了帮助您避免它们而犯的一些最常见JavaScript错误。

加载之前引用代码 (Referencing code before it’s loaded)

JavaScript loads and runs the code in the order in which it appears in the document. If you have a script defined in the head HTML tag that accesses the HTML element(s) on the page, an error will be thrown. The following is an example of this mistake:

JavaScript按照在文档中出现的顺序加载并运行代码。 如果您在头HTML标记中定义了一个脚本,该脚本访问了页面上HTML元素,则将引发错误。 以下是此错误的示例:

Image for post

To avoid making this mistake when your script relies on the HTML elements on the page, either put the JavaScript code at the end of the file, or load the JavaScript file and add an attribute (such as “defer to the script” tag). Below is an example of using the defer attribute:

为避免在脚本依赖页面上HTML元素时犯此错误,请将JavaScript代码放在文件的末尾,或加载JavaScript文件并添加属性(例如“ defer to the script”标记)。 下面是使用defer属性的示例:

Image for post

Defer Attribute — This tells the browser to download only the scripts and only executes scripts after parsing the HTML file.

延迟属性 -告诉浏览器仅下载脚本,并且仅在解析HTML文件后执行脚本。

错误地使用==和===运算符 (Using == and === Operators incorrectly)

These are both comparison operators and return boolean values. The double equal operator (==), also known as a comparison operator, is used to compare two variables but ignores the data type of the variables. Whereas the triple equal operator (===), also known as a strict comparison operator, compares two variables and also checks the datatypes of the variables.

这些都是比较运算符,并且返回布尔值。 双重等于运算符(==),也称为比较运算符,用于比较两个变量,但忽略变量的数据类型。 而三重相等运算符(===)也称为严格比较运算符,它比较两个变量并检查变量的数据类型。

Image for post

无块级范围 (No block-level scope)

Most programming languages allow developers to define variables with block-level scope in which the value of the variable becomes null outside the block. In JavaScript, however, the variable can be referenced outside the loop (scope). In the following example, variable “i” is accessible outside the for loop.

大多数编程语言都允许开发人员在块级范围内定义变量,其中变量的值在块外变为空。 但是,在JavaScript中,可以在循环(范围)之外引用该变量。 在以下示例中,变量“ i”可在for循环外访问。

Image for post

缺少功能参数 (Missing function Parameters)

When you add a new parameter to a function, it is easy to forget to update all the function calls in the code. This can easily be avoided by adding a default value for the new parameter. For example, in the code below we have added a new parameter “color” to a function with a default value “black”. If — in our code — we forget to update any function call and the argument did not get passed in then the variable will be set to “black” and it will avoid any variable undefined errors in the code.

当您向函数添加新参数时,很容易忘记更新代码中的所有函数调用。 通过为新参数添加默认值,可以轻松避免这种情况。 例如,在下面的代码中,我们向具有默认值“ black”的函数添加了新参数“ color”。 如果-在我们的代码中-我们忘记更新任何函数调用并且未传递参数,则该变量将设置为“黑色”,这将避免代码中出现任何变量未定义的错误。

Image for post

未定义!==空 (Undefined !== Null)

At first, Null and Undefined may seem the same but they are far from it. Undefined means that a variable has been declared but has not been assigned any value. Whereas Null is an assignment value meaning that you can assign it to a variable. In the following example, you can see the comparison of Null and Undefined:

起初,Null和Undefined可能看起来相同,但相距甚远。 未定义表示变量已声明但尚未分配任何值。 而Null是分配值,意味着您可以将其分配给变量。 在以下示例中,您可以看到Null和Undefined的比较:

Image for post

加法和串联 (Addition and concatenation)

JavaScript concatenates strings using ‘+’ operator. The same operator is also used for adding the numbers. As you know, we cannot define the type while declaring a variable in JavaScript, and if the types are not handled properly in the code this can lead to unpredictable results. An example is given below:

JavaScript使用'+'运算符连接字符串。 同样的运算符也用于添加数字。 如您所知,我们无法在JavaScript中声明变量时定义类型,并且如果在代码中未正确处理类型,则可能导致不可预测的结果。 下面是一个示例:

Image for post

结论 (Conclusion)

The better you understand how JavaScript works, the better and more efficient your code will be. This will also speed up your web development skills. Conversely, a lack of proper understanding of JavaScript can lead to many problems so next time you are writing JavaScript code always remember the points mentioned above! Thanks and I hope you found this article helpful.

您越了解JavaScript的工作原理,您的代码就会越高效。 这也将加快您的Web开发技能。 相反,缺乏对JavaScript的正确理解会导致许多问题,因此,下次您编写JavaScript代码时,请务必记住上述要点! 谢谢,希望对本文有所帮助。

翻译自: https://codeburst.io/avoid-these-common-javascript-mistakes-11f5311c9ec3

javascript错误

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值