8/23

2017-08-24 本文已影响0人 BaibaiWang

JavaScript运算符:

运算符 = 用于赋值
运算符 + 用于加值

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
</head>
<body>

<p>点击按钮计算 x 的值.</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo">123</p>
<script>
function myFunction()
{
    y=5;
    z=2;
    x=y+z;
    document.getElementById("demo").innerHTML=x;
}
</script>

</body>
</html>

算数运算符

+ - * / % ++ --

赋值运算符

= += -= *= /= %=

用于字符串的 + 运算符

+运算符用于把文本值或字符串变量加起来（连接起来）。
如需把两个或多个字符串变量连接起来，请使用+运算符。

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
</head>
<body>

<p>点击按钮创建及增加字符串变量。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction()
{
    txt1="What a very";
    txt2="nice day";
    txt3=txt1+txt2;
    document.getElementById("demo").innerHTML=txt3;
}
</script>

</body>
</html>

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

两个数字相加，返回数字相加的和，如果数字与字符串相加，返回字符串

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
</head>
<body>

<p>点击按钮创建及增加字符串变量。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction()
{
    var x=5+5;
    var y="5"+5;
    var z="Hello"+5;
    var demoP=document.getElementById("demo");
    demoP.innerHTML=x + "<br>" + y + "<br>" + z;
}
</script>

</body>
</html>

比较运算符

== === != !== > < >= <=
===为绝对等于,值和类型均相等才返回true;
== 值相等即返回true, 比如5 == "5"返回true.
!==不绝对等于（值和类型有一个不相等，或两个都不相等）

逻辑运算符

&& || ! 分别为 and or not

条件语句

if...else语句

if
if...else
if...else if ...else
switch

<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>

<p>点击下面的按钮，会显示出基于今日日期的消息：</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction()
{
    var x;
    var d=new Date().getDay();
    switch (d)
    {
        case 6:x="今天是星期六";
        break;
        case 0:x="今天是星期日";
        break;
        default:
        x="期待周末";
    }
    document.getElementById("demo").innerHTML=x;
}
</script>

</body>
</html>

循环

for
for/in
while
do while

for/in 语句循环遍历对象的属性

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
    
<p>点击下面的按钮，循环遍历对象 "person" 的属性。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction(){
    var x;
    var txt="";
    var person={fname:"Bill",lname:"Gates",age:56}; 
    for (x in person){
        txt=txt + person[x];
    }
    document.getElementById("demo").innerHTML=txt;
}
</script>
    
</body>
</html>

break continue语句

continue 语句只能用在循环中;
break 语句（不带标签引用），只能用在循环或 switch 中;

JavaScript标签

如需标记 JavaScript 语句，请在语句之前加上冒号
通过标签引用，break 语句可用于跳出任何 JavaScript 代码块

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>

<script>
cars=["BMW","Volvo","Saab","Ford"];
list:{
    document.write(cars[0] + "<br>"); 
    document.write(cars[1] + "<br>"); 
    document.write(cars[2] + "<br>"); 
    break list;
    document.write(cars[3] + "<br>"); 
    document.write(cars[4] + "<br>"); 
    document.write(cars[5] + "<br>"); 
}
</script>

</body>
</html>

Typeof 操作符来检测变量的数据类型

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>

<p> typeof 操作符返回变量或表达式的类型。</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = 
    typeof "john" + "<br>" + 
    typeof 3.14 + "<br>" +
    typeof false + "<br>" +
    typeof [1,2,3,4] + "<br>" +
    typeof {name:'john', age:34};
</script>

</body>
</html>

在JavaScript中，数组是一种特殊的对象类型, 因此 typeof [1,2,3,4] 返回 object;
null是一个只有一个值的特殊类型。表示一个空对象引用.
用 typeof 检测 null 返回是object。
var person = null; // 值为 null(空), 但类型为对象
设置为 undefined 来清空对象.
在 JavaScript 中, undefined 是一个没有设置值的变量。
typeof 一个没有值的变量会返回 undefined。

var person = undefined;     // 值为 undefined, 类型为 undefined
person = undefined;          // 值为 undefined, 类型是undefined

undefined和null区别:
null 和 underfined 的值相等，但类型不等

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>

<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
    typeof undefined + "<br>" +
    typeof null + "<br>" +
    (null === undefined) + "<br>" +
    (null == undefined);
</script>

</body>
</html>