javascript小白教程1
1：JavaScript 数据类型
值类型(基本类型)：字符串（String）、数字(Number)、布尔(Boolean)、对空（Null）、未定义（Undefined）、Symbol。
引用数据类型：对象(Object)、数组(Array)、函数(Function)。
如果一个变量没有定义，直接就用，会在F12控制台上看见Undefined的报错。
变量的输出：
<script> var carname1="Volvo XC60"; var carname2='Volvo XC60'; var answer1='It\'s alright'; var answer2="He is called \"Johnny\""; var answer3='He is called "Johnny"';、
var y=123e5;
var z=123e-5;
document.write(carname1 + "<br>") document.write(carname2 + "<br>") document.write(answer1 + "<br>") document.write(answer2 + "<br>") document.write(answer3 + "<br>")
document.write(y + "<br>")
document.write(z + "<br>")
</script>运行结果：
Volvo XC60
Volvo XC60
It's alright
He is called "Johnny"
He is called "Johnny"
12300000
0.00123
数组的输出：
<script> var i; var cars = new Array(); cars[0] = "Saab"; cars[1] = "Volvo"; cars[2] = "BMW"; for (i=0;i<cars.length;i++) { document.write(cars[i] + "<br>"); } </script>
运行结果：
Saab
Volvo
BMW
Object对象的属性值输出：
<script> var person= { firstname : "John", lastname : "Doe", id : 5566, hang : 9999 }; document.write(person.lastname + "<br>"); document.write(person["lastname"] + "<br>"); document.write(person["id"] + "<br>"); document.write(person["hang"] + "<br>"); </script>
运行结果：
Doe
Doe
5566
9999
Object对象的方法输出：
<body> <p>创建和使用对象方法。</p> <p>对象方法是一个函数定义,并作为一个属性值存储。</p> <p id="demo1"></p> <p id="demo2"></p> <script> var person = { firstName: "John", lastName : "Doe", id : 5566, fullName : function() { return this.firstName + " " + this.lastName; } }; document.getElementById("demo1").innerHTML = "不加括号输出函数表达式：" + person.fullName; document.getElementById("demo2").innerHTML = "加括号输出函数执行结果：" + person.fullName(); </script> </body>
输出结果：
创建和使用对象方法。
对象方法是一个函数定义,并作为一个属性值存储。
不加括号输出函数表达式：function () { return this.firstName + " " + this.lastName; }
加括号输出函数执行结果：John Doe
JavaScript的函数
<body>
<p>本例调用的函数会执行一个计算，然后返回结果：</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML=myFunction(4,3);
function myFunction(a,b){
return a*b;
}
</script>
</body>
输出结果：12
JavaScript中变量的作用域
<body> <p> 如果你的变量没有声明，它将自动成为全局变量： </p> <p id="demo"></p> <script> myFunction(); document.getElementById("demo").innerHTML = "我可以显示 " + carName; function myFunction() { carName = "Volvo"; } </script> </body>
输出结果：
1：如果你的变量没有声明，它将自动成为全局变量：
我可以显示 Volvo
2：如果定义成 var carName = "volvo";
我可可以显示Underfind,爆出没有定义。这是局部变量。
3：document.getElementById("demo").innerHTML ="我可以显示 " + window.carName; 把那行代码改写成这样
在 HTML 中, 所有全局变量都会成为 window 变量。
我可以显示 Volvo
JavaScript事件
<body> <p>点击按钮执行 <em>displayDate()</em> 函数.</p> <button onclick="displayDate()">点这里</button> <script> function displayDate(){ document.getElementById("demo").innerHTML=Date(); } </script> <p id="demo"></p> </body>
输出结果：
点击按钮执行 displayDate() 函数.
Fri May 31 2019 22:54:42 GMT+0800 (中国标准时间)
JavaScript字符串String
<body>
<p id="demo"></p>
<p id="demo1"></p>
<script>
var x = "John"; // x 是字符串
var y = new String("John"); // y 是一个对象
document.getElementById("demo").innerHTML =typeof x + " " + typeof y;
document.getElementById("demo1").innerHTML = x===y;
</script>
<p>=== 为绝对相等，即数据类型与值都必须相等。</p>
</body>
输出结果：
string object
false
=== 为绝对相等，即数据类型与值都必须相等。
JavaScript运算符
<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>
输出结果：
点击按钮创建及增加字符串变量。
10
55
Hello5
JavaScript比较
<body> <p>点击按钮检测年龄。</p> 年龄:<input id="age" value="18" /> <p>是否达到投票年龄?</p> <button onclick="myFunction()">点击按钮</button> <p id="demo"></p> <script> function myFunction() { var age,voteable; age=document.getElementById("age").value; voteable=(age<18)?"年龄太小":"年龄已达到"; document.getElementById("demo").innerHTML=voteable; } </script> </body>
输出结果：
点击按钮检测年龄。
年龄:
是否达到投票年龄?
年龄已达到
