JS 输出与变量

时间 2019-11-10

原文原文链接

1. JS的输出html

innerHTML:数组

<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8"> 
</head>

<body>

<h1>个人第一个 Web 页面</h1>

<p id="demo">个人第一个段落</p>

<script>
document.getElementById("demo").innerHTML = "段落已修改。";
</script>

</body>
</html>

document.write()：函数

　　在页面载入以后，使用 document.write 后，输出的内容将覆盖原内容。oop

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

<body>

<h1>个人第一个 Web 页面</h1>

<p>个人第一个段落。</p>

<script>
document.write(Date());
</script>

</body>
</html>

　　写到控制台的例子在前一篇已经用过了。测试

2. JS变量lua

　　用内嵌JS的 html + Chrome F12 控制台的模式，调试JS语法。spa

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

<body>

<h1>个人第一个 Web 页面</h1>

<p>个人第一个段落。</p>

<script>
c = 20;
var d = 25;
var myArray = [1, 2, 3, 4, 5];
var myObject = {id:1, name:"Hello World"};
function myPlus(a, b)
{
    return a + b;
}
console.log(myPlus(c,d));       //输出 45
console.log(myArray[0]);        //输出 1
console.log(myArray[1]);        //输出 2
console.log(myObject.id);       //输出 1
console.log(myObject.name);     //输出 Hello World
</script>

</body>
</html>

　　恰好最近在用 lua，上面这个例子能够看出：调试

弱类型；
变量声明时即赋值，var 可省略；
array 与 table 的构成方式与 lua 相同；
JS的数组索引从0开始，而不是lua从1开始；

3. JS流程控制：code

break	用于跳出循环。
catch	语句块，在 try 语句块执行出错时执行 catch 语句块。
continue	跳过循环中的一个迭代。
do ... while	执行一个语句块，在条件语句为 true 时继续执行该语句块。
for	在条件语句为 true 时，能够将代码块执行指定的次数。
for ... in	用于遍历数组或者对象的属性（对数组或者对象的属性进行循环操做）。
function	定义一个函数
if ... else	用于基于不一样的条件来执行不一样的动做。
return	退出函数
switch	用于基于不一样的条件来执行不一样的动做。
throw	抛出（生成）错误。
try	实现错误处理，与 catch 一同使用。
var	声明一个变量。
while	当条件语句为 true 时，执行语句块。

　　测试下 switch:htm

function myCalculator(calc, a, b)
{
    switch(calc)
    {
        case "plus":
            return a + b;
        case "minus":
            return a - b;
        default:
            return 0;
    }
}
console.log(myCalculator("minus", 100,19));

　　能够看出在流程控制上 JS 的语法与 C/C++ 的写法几乎相同。

　　再来测试一下 for、for in。

var myArray = [1, 2, 3, 4, 5];
var myObject = {id:1, name:"Hello World"};

function looplog(paramArray, paramObject)
{
    for(k in paramArray)
    {
        console.log(k);        //输出 0-4，可见k是索引
    }
    
    for(k in paramArray)    
    {
        console.log(paramArray[k]);
    }
    
    for(k in paramObject)
    {
        console.log(k);        //输出 id、name，k还是索引
    }
    
    for(k in paramObject)
    {
        console.log(paramObject[k]);
    }
    
    for(var i = 0; i < paramArray.length; i++)
    {
        console.log(paramArray[i]);
    }
}

looplog(myArray, myObject);