您的位置:首页 > Web前端 > JavaScript

JavaScript 基础知识--语句

2016-06-15 15:05 363 查看
现在是越学JS越感觉编程语言太相似,所以我决定对于大家熟知的一些东西,一概而过,只讲不同。关于JS的运算符(+,-,*.....)和c语言都一样,我就不提啦,++,--,也都一样,对啦,Swift 3.0 Preview 1去掉啦++和--操作符。说起Swift,我就想到啦JS中的函数和Swif中是一样的,只是JS中用function修饰。算啦,还是介绍一下JS中的函数吧!

函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。


实例

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction()
{
alert("Hello World!");
}
</script>
</head>

<body>
<button onclick="myFunction()">点击这里</button>
</body>
</html>



JavaScript 函数语法

函数就是包裹在花括号中的代码块,前面使用了关键词 function:
function functionname()
{
这里是要执行的代码
}


当调用该函数时,会执行函数内的代码。

可以在某事件发生时直接调用函数(比如当用户点击按钮时),并且可由 JavaScript 在任何位置进行调用。

JavaScript 对大小写敏感。关键词 function 必须是小写的,并且必须以与函数名称相同的大小写来调用函数。


调用带参数的函数

在调用函数时,您可以向其传递值,这些值被称为参数。

这些参数可以在函数中使用。

您可以发送任意多的参数,由逗号 (,) 分隔:
myFunction(argument1,argument2)


当您声明函数时,请把参数作为变量来声明:
function myFunction([code]var1
,
var2
)
{
这里是要执行的代码
}
[/code]

变量和参数必须以一致的顺序出现。第一个变量就是第一个被传递的参数的给定的值,以此类推。

实例

<button onclick="myFunction('Bill Gates','CEO')">点击这里</button>

<script>
function myFunction(name,job)
{
alert("Welcome " + [code]name
+ ", the " +
job
);
}
</script>[/code]

上面的函数会当按钮被点击时提示 "Welcome Bill Gates, the CEO"。

函数很灵活,您可以使用不同的参数来调用该函数,这样就会给出不同的消息:

实例

<button onclick="myFunction('Harry Potter','Wizard')">点击这里</button>
<button onclick="myFunction('Bob','Builder')">点击这里</button>


根据您点击的不同的按钮,上面的例子会提示 "Welcome Harry Potter, the Wizard" 或 "Welcome Bob, the Builder"。


带有返回值的函数

有时,我们会希望函数将值返回调用它的地方。

通过使用 return 语句就可以实现。

在使用 return 语句时,函数会停止执行,并返回指定的值。

语法

function myFunction()
{
var x=5;
[code]return x;

}
[/code]

上面的函数会返回值 5。

注释:整个 JavaScript 并不会停止执行,仅仅是函数。JavaScript 将继续执行代码,从调用函数的地方。

函数调用将被返回值取代:
var myVar=myFunction();


myVar 变量的值是 5,也就是函数 "myFunction()" 所返回的值。

即使不把它保存为变量,您也可以使用返回值:
document.getElementById("demo").innerHTML=myFunction();


"demo" 元素的 innerHTML 将成为 5,也就是函数 "myFunction()" 所返回的值。

您可以使返回值基于传递到函数中的参数:

实例

计算两个数字的乘积,并返回结果:
function myFunction(a,b)
{
return a*b;
}

document.getElementById("demo").innerHTML=myFunction(4,3);


"demo" 元素的 innerHTML 将是:
12


在您仅仅希望退出函数时 ,也可使用 return 语句。返回值是可选的:
function myFunction(a,b)
{
if (a>b)
{
return;
}
x=a+b
}


如果 a 大于 b,则上面的代码将退出函数,并不会计算 a 和 b 的总和。


局部 JavaScript 变量

在 JavaScript 函数内部声明的变量(使用 var)是局部变量,所以只能在函数内部访问它。(该变量的作用域是局部的)。

您可以在不同的函数中使用名称相同的局部变量,因为只有声明过该变量的函数才能识别出该变量。

只要函数运行完毕,本地变量就会被删除。


全局 JavaScript 变量

在函数外声明的变量是全局变量,网页上的所有脚本和函数都能访问它。


JavaScript 变量的生存期

JavaScript 变量的生命期从它们被声明的时间开始。

局部变量会在函数运行以后被删除。

全局变量会在页面关闭后被删除。


向未声明的 JavaScript 变量来分配值

如果您把值赋给尚未声明的变量,该变量将被自动作为全局变量声明。

这条语句:
carname="Volvo";


将声明一个全局变量 carname,即使它在函数内执行。

好啦!函数说完啦,下面简单说一些常用的语句,都是大家熟知的。

if 语句 - 只有当指定条件为 true 时,使用该语句来执行代码
if...else 语句 - 当条件为 true 时执行代码,当条件为 false 时执行其他代码
if...else if....else 语句 - 使用该语句来选择多个代码块之一来执行
switch 语句 - 使用该语句来选择多个代码块之一来执行

for - 循环代码块一定的次数
for/in - 循环遍历对象的属性,,注意for..in
while - 当指定的条件为 true 时循环指定的代码块
do/while - 同样当指定的条件为 true 时循环指定的代码块

还有:break 语句用于跳出循环。

           continue 用于跳过循环中的一个迭代。

注意,下面要讲个iOS中没有,但是Android有的一个语法:测试错误语句

try 语句测试代码块的错误。

catch 语句处理错误。

throw 语句创建自定义错误。

错误一定会发生

当 JavaScript 引擎执行 JavaScript 代码时,会发生各种错误:

可能是语法错误,通常是程序员造成的编码错误或错别字。

可能是拼写错误或语言中缺少的功能(可能由于浏览器差异)。

可能是由于来自服务器或用户的错误输出而导致的错误。

当然,也可能是由于许多其他不可预知的因素。


JavaScript 抛出错误

当错误发生时,当事情出问题时,JavaScript 引擎通常会停止,并生成一个错误消息。

描述这种情况的技术术语是:JavaScript 将抛出一个错误。

JavaScript 测试和捕捉

try 语句允许我们定义在执行时进行错误测试的代码块。

catch 语句允许我们定义当 try 代码块发生错误时,所执行的代码块。

JavaScript 语句 try 和 catch 是成对出现的。

语法

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

实例

在下面的例子中,我们故意在 try 块的代码中写了一个错字。

catch 块会捕捉到 try 块中的错误,并执行代码来处理它。
<!DOCTYPE html>
<html>
<head>
<script>
var txt="";
function message()
{
try
{
adddlert("Welcome guest!");
}
catch(err)
{
txt="There was an error on this page.\n\n";
txt+="Error description: " + err.message + "\n\n";
txt+="Click OK to continue.\n\n";
alert(txt);
}
}
</script>
</head>

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

</html>


Throw 语句

throw 语句允许我们创建自定义错误。

正确的技术术语是:创建或抛出异常(exception)。

如果把 throw 与 try 和 catch 一起使用,那么您能够控制程序流,并生成自定义的错误消息。

语法

throw exception


异常可以是 JavaScript 字符串、数字、逻辑值或对象。

实例

本例检测输入变量的值。如果值是错误的,会抛出一个异常(错误)。catch 会捕捉到这个错误,并显示一段自定义的错误消息:
<script>
function myFunction()
{
try
{
var x=document.getElementById("demo").value;
if(x=="")    [code]throw "empty"
;
if(isNaN(x))
throw "not a number"
;
if(x>10)
throw "too high"
;
if(x<5)
throw "too low"
;
}
catch(err)
{
var y=document.getElementById("mess");
y.innerHTML="Error: " + err + ".";
}
}
</script>

<h1>My First JavaScript</h1>
<p>Please input a number between 5 and 10:</p>
<input id="demo" type="text">
<button type="button" onclick="myFunction()">Test Input</button>
<p id="mess"></p>[/code]

     然而,我感觉这个语法是个鸡肋,纯粹感觉.....
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息