1.JavaScript 对象
对象由花括号分隔。在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔。
var person={firstname:"John", lastname:"Doe", id:5566};
上面例子中的对象 (person) 有三个属性：firstname、lastname 以及 id。
空格和折行无关紧要。声明可横跨多行。
var person={
firstname : "John",
lastname : "Doe",
id : 5566
};
对象属性有两种调用方式。
name=person.lastname;
name=person["lastname"];
例如：
<!DOCTYPE html>
<html>
<head>
<meta charset="tf-8">
<title>实例</title>
</head>
<body>
<script>
var idd={
firstname: "John",
lastname:"Doe",
id:556
};
document.write(idd.lastname+"</br>");
document.write(idd["lastname"]+"</br>");
</script>
</body>
</html>
JavaScript 数组
什么是数组？
不同类型的数据，按照顺序，组成的引用数据类型。
数组作用？
可以通过一个变量保存一组不同类型的数据
如何创建数组？
1.new Array()
var arr=new Array();//空数组
var arr01=new Array(3);//创建指定初始存储空间数组
2.通过"[]"表示数组
var arr2=[];//空数组
数组如何保存数据值？
1.通过下标逐个赋值
下标表示数据在数组中的位置，从0开始
var arr11=new Array(); //空数组
arr11[0]=1001;
arr11[1]="zhangsan";
arr11[2]=23;
var arr22=[];
arr22[0]=1004;
arr22[1]="zhaoliu";
arr22[2]=26;
2.创建时直接赋值
var arr12=new Array( 1002,"list",24);
var arr13=[1003,"wangwu",24];
从数组中取出对应位置[下标]的数据
alert（arr22[1]）；
例如：
<!DOCTYPE html>
<html>
<head>
<meta charset="tf-8">
<title>实例</title>
</head>
<body>
<script>
var arr11=new Array();//创建指定初始存储空间的空数组,先占位置
arr11[0]=1001;
arr11[1]="zhangsan"
arr11[2]=23
var arr22=[]; //创建空数组
arr22[0]=1002;
arr22[1]=1002;
arr22[0]=1002;
alert(arr11[2]);
//创建时直接赋值
var arr12=new Array(1002,"lisi",24);//指定存储空间数组赋值
var arr13=[1003,"wangwu",25];//直接给数组赋值
//从数组中取出对应位置[下标]的数据
alert(arr13[0]);
</script>
</body>
</html>JavaScript 函数
什么是JavaScript函数
某个功能具体执行代码的集合--函数
封装某个功能的执行代码
如何创建函数？
通过function关键字来创建
格式：
function 函数名称（参数列表）{
函数体
【return xxxx；】
}
function--创建函数的关键字
函数名称--首字母小写，从第二个单词开始首字母大写
（参数列表） 参数--接收函数之外的数据值进入函数中参加运算活动【找帮手】
可以有多个，中间","分割，是一个变量没有，无需var定义
{}函数体--编写具体执行代码。
[ return xxxx];--可选，表示返回函数的执行结果
当函数有执行结果的时候，函数体中的最后一句话一定是 return xxxx；
当函数没有执行结果的时候，不用写return xxxx;
<!DOCTYPE html>
<html>
<head>
<meta charset="tf-8">
<title>实例</title>
</head>
<body>
<script>
function test1() {
alert("没有参数，没有返回值");
}
function test2(num) {
alert("有一个参数，没有返回值");
}
function test3(num, str) {
alert("有多个参数，没有返回值");
}
function test4() {
alert("没有参数，有返回值");
return "";
}
function test5(num) {
alert("有一个参数，有返回值的函数");
return "";
}
function test6(num, str) {
alert("有多个参数，有返回值的函数");
return "";
}
//函数的调用
//要什么，给什么；给什么，收什么。
test1();
test2("zhangsan");
var res = test6(1001, "zhangsan");//创建一个新的变量，用来接受给出的返回值
</script>
</body>
</html>2.认识JavaScript对象
JavaScript对象是拥有属性和方法的数据。
真实生活中，一辆汽车是一个对象。
对象有它的属性，如重量和颜色等，方法有启动停止等。
| 对象 | 属性 | 方法 |
|
|
|
|
什么是对象？
描述一类具体事物的引用数据类型--对象
为什么需要对象类型？
因为javascript中的数据类型，在使用的时候可能不够用，我们需要自己定义创建一种新的类型。
如何创建对象类型？
创建对象的方式有多种，我们今天介绍通过字面量方式创建对象。
通过字面量方式创建对象需要使用"{}"
对象中有那些元素？
属性--变量，功能--方法
属性是一个键值对的形式（name：value）来定义
如果有多个使用","分割
方法是一个函数
var car={
name:"bmw",
color:"白色",
run:function(){
alert("前进");
},
carback:function(){
alert("后退");
}
}
name/color是对象的属性，run/carback是对象的方法
对象访问属性
1.对象名称.属性名称
alert(car.name);
2.对象名称["属性名称"]
alert(car["color"]);
对象访问方法
[var 变量=]对象名称.方法名称([参数列表]);
car.run();
car.carback();
例如：
<!DOCTYPE html>
<html>
<head>
<meta charset="tf-8">
<title>实例</title>
</head>
<body>
<script>
var car={
name:"bmw",
color:"白色",
run:function(){
alert("前进")
},
carback:function(){
alert("后退")
}
}
alert(car.name);
car.run();
</script>
</body>
</html>3.关于变量的划分
JavaScript变量的分类
1.全局JavaScript变量
在函数外声明的变量是全局变量
在网页上的所有脚本和函数都能访问它
全局变量会在页面关闭后被删除。
var testname="测试全局变量"; 全局JavaScript变量
2.局部JavaScript变量
在JavaScript函数内部声明的变量（使用var）是局部变量，包含函数的参数
只能在当前函数中使用，超出当前函数就无法使用
只要函数运行完毕，本地变量就会被删除。
未定义的变量赋值以后就是该变量将被自动作为window的一个属性
window是javascript中的一个内置对象
我们可以认为全局JavaScript变量是属性window对象
函数中的变量，没有使用var定义的时候就是全局变量，在使用之前重新赋值。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>实例</title>
</head>
<body>
<script>
var testname="测试全局变量"
function test1(){
var name="zhangsan";//局部变量
address="西安"//全局变量
alert(window.testname);//访问全局变量
alert(testname);//访问全局变量
}
function test(){
address="北京";
alert(address);//访问全局变量
}
test1();
</script>
</body>
</html>4.JavaScript作用域
变量，对象，函数的有效访问范围--就是作用域。
JavaScript局部作用域
变量在函数内声明，变量为局部作用域。
局部变量：只能在函数内部访问。
例如：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>实例</title>
</head>
<body>
<p>局部变量在声明的函数外不可以访问。</p>
<p id="demo"></p>
<script>
myFunction();
document.getElementById("demo").innerHTML="carName 的类型是:"+typeof carName;
function myFunction(){
var carName="volvo"
}
</script>
</body>
</html>JavaScript全局变量
变量在函数外定义，即为全局变量。
全局变量有全局作用域：网页中所有脚本和函数均可使用。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>实例</title>
</head>
<body>
<p>全局变量在任何脚本和函数内均可访问。</p>
<p id="demo"></p>
<script>
var carName="volvo"
myFunction();
function myFunction(){
document.getElementById("demo").innerHTML="我可以显示"+carName;
}
</script>
</body>
</html>如果变量在函数内没有声明（没有使用var关键字），该变量为全局变量。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>实例</title>
</head>
<body>
<p>如果你的变量额米有声明，它将自动成为全局变量：</p>
<p id="demo"></p>
<script>
myFunction();
document.getElementById("demo").innerHTML="我可以显示"+carName;
function myFunction(){
carName="volvo"
}
</script>
</body>
</html>函数参数
函数参数只在函数内起作用，是局部变量
HTML中的全局变量
在HTML中，全局变量是window对象：所有数据变量都属于window对象。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>wangxing</title>
</head>
<body>
<p>在 HTML 中, 所有全局变量都会成为 window 变量。</p>
<p id="demo"></p>
<script>
myFunction();
document.getElementById("demo").innerHTML ="我可以显示 " + window.carName;
function myFunction() {
carName = "Volvo";
}
</script>
</body>
</html>
5.JavaScript 运算符
JavaScript 算数运算符 [+ - * / % ++ --]
+运算符用于把文本值或字符串变量加起来（连接起来）。
如需把两个或多个字符串变量连接起来，请使用+运算符。
两个数字相加，返回数字相加的和，如果数字与字符串相加，返回字符串。
JavaScript比较运算符 [> < >= <= == === !=]
比较运算符在逻辑语句中使用，以测定变量或值是否相等。
可以在条件语句中使用比较运算符对值进行比较，然后根据结果来采取行动，后面内容中介绍。
JavaScrip逻辑运算符 [|| && !]
逻辑运算符用于测定变量或值之间的逻辑。
JavaScrip条件运算符
JavaScript 还包含了基于某些条件对变量进行赋值的条件运算符。
格式：var res=（condition）？value1：value：2
例如:如果变量 age 中的值小于 18，则向变量 voteable 赋值 "年龄太小"，否则赋值 "年龄已达到"。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>实例</title>
</head>
<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>
</html> typeof操作符
typeof操作符来检测变量的数据类型‘
例如：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>wangxing</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。
扫一扫
498
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
