JavaScript基础学习零碎知识记录

最新推荐文章于 2023-07-13 14:32:48 发布

绝凌峰

最新推荐文章于 2023-07-13 14:32:48 发布

阅读量511

点赞数

分类专栏： js

本文链接：https://blog.csdn.net/juelingfeng/article/details/38416727

版权

js 专栏收录该内容

43 篇文章 0 订阅

订阅专栏

一、 JavaScript 对大小写敏感:

JavaScript 变量名称的规则：

变量对大小写敏感（y 和 Y 是两个不同的变量）
变量必须以字母或下划线开始

注释：由于 JavaScript 对大小写敏感，变量名也对大小写敏感。

注意：别忘记 JavaScript 中大小写字母的重要性。"function" 这个词必须是小写的，否则 JavaScript 就会出错。另外需要注意的是，必须使用大小写完全相同的函数名来调用函数。

二、如果您再次声明了 JavaScript 变量，该变量也不会丢失其原始值。

var x=5;
var x;

在以上语句执行后，变量 x 的值仍然是 5。在重新声明该变量时，x 的值不会被重置或清除。

三、对字符串和数字进行加法运算

请看这些例子：

x=5+5;
document.write(x);

x="5"+"5";
document.write(x);

x=5+"5";
document.write(x);

x="5"+5;
document.write(x);

规则是：

如果把数字与字符串相加，结果将成为字符串。

四、JavaScript Switch 语句

如果希望选择执行若干代码块中的一个，你可以使用 switch 语句：

语法：

switch(n)
   {
   case 1:
     执行代码块 1
     break
   case 2:
     执行代码块 2
     break
   default:
     如果n即不是1也不是2，则执行此代码
   }

工作原理：switch 后面的 (n) 可以是表达式，也可以（并通常）是变量。然后表达式中的值会与 case 中的数字作比较，如果与某个 case 相匹配，那么其后的代码就会被执行。break 的作用是防止代码自动执行到下一行。

五、可以在 JavaScript 中创建三种消息框：警告框、确认框、提示框。（http://www.w3school.com.cn/js/js_popup.asp）

警告框

警告框经常用于确保用户可以得到某些信息。

当警告框出现后，用户需要点击确定按钮才能继续进行操作。

语法：

alert("文本")

确认框

确认框用于使用户可以验证或者接受某些信息。

当确认框出现后，用户需要点击确定或者取消按钮才能继续进行操作。

如果用户点击确认，那么返回值为 true。如果用户点击取消，那么返回值为 false。

语法：

confirm("文本")

提示框

提示框经常用于提示用户在进入页面前输入某个值。

当提示框出现后，用户需要输入某个值，然后点击确认或取消按钮才能继续操纵。

如果用户点击确认，那么返回值为输入的值。如果用户点击取消，那么返回值为 null。

语法：

prompt("文本","默认值")

实例：

警告框：

<html>
<head>
<script type="text/javascript">
function disp_alert()
{
alert("我是警告框！！")
}
</script>
</head>
<body>
<input type="button" οnclick="disp_alert()" value="显示警告框" />
</body>
</html>

带有折行的警告框：

<html>
<head>
<script type="text/javascript">
function disp_alert()
{
alert("再次向您问好！在这里，我们向您演示" + '\n' + "如何向警告框添加折行。")
}
</script>
</head>
<body>
<input type="button" οnclick="disp_alert()" value="显示警告框" />
</body>
</html>

确认框：

<html>
<head>
<script type="text/javascript">
function show_confirm()
{
var r=confirm("Press a button!");
if (r==true)
{
alert("You pressed OK!");
}
else
{
alert("You pressed Cancel!");
}
}
</script>
</head>
<body>
<input type="button" οnclick="show_confirm()" value="Show a confirm box" />
</body>
</html>

提示框：

<html>
<head>
<script type="text/javascript">
function disp_prompt()
{
var name=prompt("请输入您的名字","Bill Gates")
if (name!=null && name!="")
{
document.write("你好！" + name + " 今天过得怎么样？")
}
}
</script>
</head>
<body>
<input type="button" οnclick="disp_prompt()" value="显示提示框" />
</body>
</html>

六、JavaScript 变量的生存期

当您在函数内声明了一个变量后，就只能在该函数中访问该变量。当退出该函数后，这个变量会被撤销。这种变量称为本地变量。您可以在不同的函数中使用名称相同的本地变量，这是因为只有声明过变量的函数能够识别其中的每个变量。

如果您在函数之外声明了一个变量，则页面上的所有函数都可以访问该变量。这些变量的生存期从声明它们之后开始，在页面关闭时结束。

七、do...while 循环

do...while 循环是 while 循环的变种。该循环程序在初次运行时会首先执行一遍其中的代码，然后当指定的条件为 true 时，它会继续这个循环。所以可以这么说，do...while 循环为执行至少一遍其中的代码，即使条件为 false，因为其中的代码执行后才会进行条件验证。

语法：

do
{
    需执行的代码
}
while (变量<=结束值)

实例1：

<html>
<body>
<script type="text/javascript">
var i=0
do 
{
document.write("The number is " + i)
document.write("<br />")
i=i+1
}
while (i<0)
</script>
</body>
</html>

结果：

The number is 0

实例2：

<html> <body> <script type="text/javascript"> var i = 0 do { document.write("数字是 " + i) document.write("<br />") i++ } while (i <= 5) </script> </body> </html>

结果：

数字是 0

数字是 1

数字是 2

数字是 3

数字是 4

数字是 5

八、JavaScript break 和 continue 语句

有两种特殊的语句可用在循环内部：break 和 continue。

Break

break 命令可以终止循环的运行，然后继续执行循环之后的代码（如果循环之后有代码的话）。

实例：

<html>
<body>
<script type="text/javascript">
var i=0
for (i=0;i<=10;i++)
{
if (i==3){break}
document.write("The number is " + i)
document.write("<br />")
}
</script>
</body>
</html>

结果：

The number is 0
The number is 1
The number is 2

Continue

continue 命令会终止当前的循环，然后从下一个值继续运行。

实例：

<html>
<body>
<script type="text/javascript">
var i=0
for (i=0;i<=10;i++)
{
if (i==3){continue}
document.write("The number is " + i)
document.write("<br />")
}
</script>
</body>
</html>

结果：

The number is 0
The number is 1
The number is 2
The number is 4
The number is 5
The number is 6
The number is 7
The number is 8
The number is 9
The number is 10

九、For...In 声明用于遍历数组或者对象的属性（对数组或者对象的属性进行循环操作）。

实例：

<html><body> <script type="text/javascript">                                     var x;       var mycars = new Array();                                              mycars[0] = "宝马"; mycars[1] = "奔驰"; mycars[2] = "宾利";                          for (x in mycars){ document.write(mycars[x] + "<br/>") }                </script>  </body> </html>

结果：

宝马

奔驰

宾利

十、JavaScript 事件

onload 和 onUnload

当用户进入或离开页面时就会触发 onload 和 onUnload 事件。

onload 事件常用来检测访问者的浏览器类型和版本，然后根据这些信息载入特定版本的网页。

onload 和 onUnload 事件也常被用来处理用户进入或离开页面时所建立的 cookies。例如，当某用户第一次进入页面时，你可以使用消息框来询问用户的姓名。姓名会保存在 cookie 中。当用户再次进入这个页面时，你可以使用另一个消息框来和这个用户打招呼："Welcome John Doe!"。

onFocus, onBlur 和 onChange

onFocus、onBlur 和 onChange 事件通常相互配合用来验证表单。onBlur失去焦点 onFocus当获得焦点

下面是一个使用 onChange 事件的例子。用户一旦改变了域的内容，checkEmail() 函数就会被调用。

<input type="text" size="30" id="email" οnchange="checkEmail()">

onSubmit

onSubmit 用于在提交表单之前验证所有的表单域。

下面是一个使用 onSubmit 事件的例子。当用户单击表单中的确认按钮时，checkForm() 函数就会被调用。假若域的值无效，此次提交就会被取消。checkForm() 函数的返回值是 true 或者 false。如果返回值为true，则提交表单，反之取消提交。

<form method="post" action="xxx.htm" οnsubmit="return checkForm()">

onMouseOver 和 onMouseOut

onMouseOver 和 onMouseOut 用来创建“动态的”按钮。

下面是一个使用 onMouseOver 事件的例子。当 onMouseOver 事件被脚本侦测到时，就会弹出一个警告框：

<a href="http://www.w3school.com.cn"
οnmοuseοver="alert('An onMouseOver event');return false">

<img src="w3school.gif" width="100" height="30">

</a>

十一、异常

JavaScript - 捕获错误

有两种在网页中捕获错误的方法：

使用 try...catch 语句。(在 IE5+、Mozilla 1.0、和 Netscape 6 中可用)
使用 onerror 事件。这是用于捕获错误的老式方法。(Netscape 3 以后的版本可用)

注意：chrome、opera 和 safari 浏览器不支持 onerror 事件。

Try...Catch 语句

try...catch 可以测试代码中的错误。try 部分包含需要运行的代码，而 catch 部分包含错误发生时运行的代码。

语法：

try
{
   //在此运行代码
}
catch(err)
{
   //在此处理错误
}

注意：try...catch 使用小写字母。大写字母会出错。

实例 1

下面的例子原本用在用户点击按钮时显示 "Welcome guest!" 这个消息。不过 message() 函数中的 alert() 被误写为 adddlert()。这时错误发生了：

<html>
<head>
<script type="text/javascript">
function message()
{
adddlert("Welcome guest!")
}
</script>
</head>

<body>
<input type="button" value="View message" οnclick="message()" />
</body>

</html>

我们可以添加 try...catch 语句，这样当错误发生时可以采取更适当的措施。

下面的例子用 try...catch 语句重新修改了脚本。由于误写了 alert()，所以错误发生了。不过这一次，catch 部分捕获到了错误，并用一段准备好的代码来处理这个错误。这段代码会显示一个自定义的出错信息来告知用户所发生的事情。

<html>
<head>
<script type="text/javascript">
var txt=""
function message()
{
try
  {
  adddlert("Welcome guest!")
  }
catch(err)
  {
  txt="此页面存在一个错误。\n\n"
  txt+="错误描述: " + err.description + "\n\n"
  txt+="点击OK继续。\n\n"
  alert(txt)
  }
}
</script>
</head>

<body>
<input type="button" value="View message" οnclick="message()" />
</body>

</html>

实例 2

下一个例子会显示一个确认框，让用户来选择在发生错误时点击确定按钮来继续浏览网页，还是点击取消按钮来回到首页。如果 confirm 方法的返回值为 false，代码会把用户重定向到其他的页面。如果 confirm 方法的返回值为 true，那么代码什么也不会做。

<html>
<head>
<script type="text/javascript">
var txt=""
function message()
{
try
  {
  adddlert("Welcome guest!")
  }
catch(err)
  {
  txt="There was an error on this page.\n\n"
  txt+="Click OK to continue viewing this page,\n"
  txt+="or Cancel to return to the home page.\n\n"
  if(!confirm(txt))
    {
    document.location.href="http://www.w3school.com.cn/"
    }
  }
}
</script>
</head>

<body>
<input type="button" value="View message" οnclick="message()" />
</body>

</html>

throw 声明的作用是创建 exception（异常或错误）。

Throw 声明

throw 声明的作用是创建 exception（异常）。你可以把这个声明与 try...catch 声明配合使用，以达到控制程序流并产生精确错误消息的目的。

语法：

throw(exception)

exception 可以是字符串、整数、逻辑值或者对象。

注意：使用小写字母编写 throw。使用大写字母会出错！

实例

下面的实例的作用是测定变量 x 的值。如果 x 的值大于 10 或者小于 0，错误就会被抛出 (throw)。这个错误被 catch 的参数捕获后，就会显示出自定义的出错信息。

<html>
<body>
<script type="text/javascript">
var x=prompt("Enter a number between 0 and 10:","")
try
{ 
if(x>10) 
throw "Err1"
else if(x<0)
throw "Err2"
} 
catch(er)
{
if(er=="Err1") 
alert("Error! The value is too high")
if(er == "Err2") 
alert("Error! The value is too low") 
}
</script>
</body>
</html>

十二、JavaScript 中使用反斜杠来向文本字符串添加特殊字符

插入特殊字符

反斜杠用来在文本字符串中插入省略号、换行符、引号和其他特殊字符。

请看下面的 JavaScript 代码：

var txt="We are the so-called "Vikings" from the north."
document.write(txt)

在 JavaScript 中，字符串使用单引号或者双引号来起始或者结束。这意味着上面的字符串将被截为：We are the so-called。

要解决这个问题，就必须把在 "Viking" 中的引号前面加上反斜杠 (\)。这样就可以把每个双引号转换为字面上的字符串。

var txt="We are the so-called \"Vikings\" from the north."
document.write(txt)

现在 JavaScript 就可以输出正确的文本字符串了：We are the so-called "Vikings" from the north。

这是另一个例子：

document.write ("You \& me are singing!")

上面的例子会产生以下输出：

You & me are singing!

下面的表格列出了其余的特殊字符，这些特殊字符都可以使用反斜杠来添加到文本字符串中：

代码	输出
\'	单引号
\"	双引号
\&	和号
\\	反斜杠
\n	换行符
\r	回车符
\t	制表符
\b	退格符
\f	换页符

十三、其他一些需要了解的重要事项

JavaScript 对大小写敏感

名为 "myfunction" 的函数和名为 "myFunction" 的函数是两个不同的函数，同样，变量 "myVar" 和变量 "myvar" 也是不同的。

JavaScript 对大小写敏感 - 所以当您创建或使用变量、对象及函数时，请注意字符的大小写。

空格

JavaScript 会忽略多余的空格。所以您可以在代码中添加适当的空格，使得代码的可读性更强。下面的两行是等效的：

name="Hege"
name = "Hege"

换行

您可以在文本字符串内部使用反斜杠对代码进行折行。下面的例子是正确的：

document.write("Hello \

World!")

但是不能像这样折行：

document.write \

("Hello World!")

绝凌峰

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript基础学习零碎知识记录

一、 JavaScript 对大小写敏感: JavaScript 变量名称的规则：变量对大小写敏感（y 和 Y 是两个不同的变量）变量必须以字母或下划线开始注释：由于JavaScript 对大小写敏感，变量名也对大小写敏感。注意：别忘记JavaScript 中大小写字母的重要性。"function" 这个词必须是小写的，否则 JavaScript就会出
复制链接

扫一扫