JS基础语法解析

1.document.getElementById(“demo”).innerHTML = “字符串，数字”

<script>
	document.getElementById("demo").innerHTML = 5 * 10;
</script>

• 输出：在页面数据添加的内容

2.

<script>
	document.write("你好 \世界!");
	
	var x=5;
	var y=6;
	var z=x+y;
	document.write(x + "<br>");
	document.write(y + "<br>");
	document.write(z + "<br>");

	var pi=3.14;
	var name="Bill Gates";
	var answer='Yes I am!';
	document.write(pi + "<br>");
	document.write(name + "<br>");
	document.write(answer + "<br>");
</script>

• 输出：页面输出你好世界

3.JavaScript 数据类型

<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>

• 结果输出

typeof 操作符返回变量或表达式的类型。
string
number
boolean
object
object

4.JavaScript 数组

<script>
var person=
{
	firstname : "John",
	lastname  : "Doe",
	id        :  5566
};
document.write(person.lastname + "<br>");
document.write(person["lastname"] + "<br>");
</script>

• 输出

Doe
Doe

5.JavaScript 对象

<script>
var person=
{
	firstname : "John",
	lastname  : "Doe",
	id        :  5566
};
document.write(person.lastname + "<br>");
document.write(person["lastname"] + "<br>");
</script>

• 输出

Doe
Doe

6.Undefined 和 Null

<script>
var person;
var car="Volvo";
document.write(person + "<br>");
document.write(car + "<br>");
var car=null
document.write(car + "<br>");
</script>

<script>
    // 声明变量类型
	//当您声明新变量时，可以使用关键词 "new" 来声明其类型：
	var carname=new String;
	var x=      new Number;
	var y=      new Boolean;
	var cars=   new Array;
	var person= new Object;
</script>

• 输出

undefined
Volvo
null

7.JavaScript 对象

<p id="demo"></p>
<script>
var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
document.getElementById("demo").innerHTML =
	person.firstName + " 现在 " + person.age + " 岁.";
</script>
//==========================================================
<p id="demo"></p>
<script>
var person = {
    firstName : "John",
    lastName  : "Doe",
    age       : 50,
    eyeColor  : "blue"
};
document.getElementById("demo").innerHTML =
	person.firstName + " 现在 " + person.age + " 岁。";
</script>
/*
访问对象的写法
*/
//===================================================
<p>
你可以使用 .property 或 ["property"]。
</p>
<p id="demo"></p>
<script>
var person = {
    firstName: "John",
    lastName : "Doe",
    id : 5566
};
document.getElementById("demo").innerHTML =
	person["firstName"] + " " + person["lastName"];
</script>
/*
对象的输出结果
有两种方式可以访问对象属性：
你可以使用 .property 或 ["property"].
John Doe
*/
<p>
你可以使用 .property 或 ["property"].
</p>
<p id="demo"></p>
<script>
var person = {
    firstName : "John",
    lastName : "Doe",
    id : 5566
};
document.getElementById("demo").innerHTML =
	person.firstName + " " + person.lastName;
</script>
/*
对象的输出结果
有两种方式可以访问对象属性：
你可以使用 .property 或 ["property"].
John Doe
*/

• 输出

创建 JavaScript 对象。
John 现在 50 岁.

8.访问对象方法

<p>创建和使用对象方法。</p>
<p>对象方法作为一个函数定义存储在对象属性中。</p>
<p id="demo"></p>
<script>
var person = {
    firstName: "John",
    lastName : "Doe",
    id : 5566,
    fullName : function() 
	{
       return this.firstName + " " + this.lastName;
    }
};
document.getElementById("demo").innerHTML = person.fullName();
</script>

• 输出

对象方法作为一个函数定义存储在对象属性中。
John Doe

案例：

<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();
//输出
/*
创建和使用对象方法。
对象方法是一个函数定义,并作为一个属性值存储。
不加括号输出函数表达式：function() { return this.firstName + " " + this.lastName; }
加括号输出函数执行结果：John Doe
*/

9.