JS之 基本语法 & 与html相结合 & JS的可变参数arguments |
---|
一、关于JavaScript
概述:
1.简单性 JavaScript是一种脚本编写语言,它采用小程序段的方式实现编程,
像其它脚本语言一样,JavaScript同样已是一种解释性语言,它提供了一个简易的开发过程。
2.动态性 JavaScript是动态的,它可以直接对用户或客户输入做出响应,无须经
过Web服务程序。它对用户的反映响应,是采用以事件驱动的方式进行的。
所谓事件驱动,就是指在主页中执行了某种操作所产生的动作,就称为“事件”。
比如按下鼠标、移动窗口、选择菜单等都可以视为事件。
当事件发生后,可能会引起相应的事件响应。
3.跨平台性 JavaScript是依赖于浏览器本身,与操作环境无关,
只要能运行浏览器的计算机,并支持JavaScript的浏览器就可以正确执行。
4.节省CGI的交互时间 随着WWW的迅速发展有许WWW服务器提供的服务要与浏览者进
行交流,确浏览的身份、需服务的内等等,
这项工作通常由CGI/PERL编写相应的接口程序与用户进行交互来完成。
5.JavaScript是一种基于客户端浏览器的语言,用户在浏览中填表、
验证的交互过程只是通过浏览器对调入HTML文档中的JavaScript源代码进行解释执行来完成
的,即使是必须调用CGI的部分,
浏览器只将用户输入验证后的信息提交给远程的服务器,大大减少了服务器的开销。
(一)、javaScript的变量类型:
数值类型: number short int long float double
字符串类型: string
对象类型: object
布尔类型: boolean
函数类型: function
javascript里特殊的值:
undedined 表示未定义
null 表示为空值
NAN 表示非数字(not a number)
JS中的定义变量格式:
var 变量名;
var 变量名 = 值;
二JS的作用和用法
快捷键: Shift+Ctrl+C 在JavaScript中注释
1、JavaScript和html代码的结合方式
2、一个Script标签要么用来定义javaScript代码,要么用来引入单独的js文件
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>the script effect</title>
<script type="text/javascript">
//script标签作用一
alert("我是script标签 我的作用之一是定义 js代码~~");
</script>
<script type="text/javascript" src="alert2.js">
//script作用之二
引入了js文件 alert2.js 执行引入文件js内容(写入文件路径)
</script>
</head>
<body>
<font color="blue" size="3" >我是<body>标签 此html引入了别的地方的js</font>
</body>
</html>
2、JavaScript和html代码的结合方式
<1>只需要在head 标签中,或者在body标签中,使用script 标签 可以定义JavaScript代码
<2>使用Script 标签引入 单独的JavaScript代码文件
三、script的变量 关系 和 可变参数
<1>变量无类型限制所有类型均可用var 关键字来创建
<2>同一个变量可以接受容易的值取最后一次赋的值
<3>script不支持重载 重载即为覆盖
<4> 0 、null、 undefined、”“(空串) 都认为是 false;
<5> 两个对象做比较 == ==== 分别是判断 字面值 和 (字面值以及类型)
(一)、测试Var 创建的对象 和赋值的改变过程以及类型判断
<script type="text/javascript">
var object;
alert("我在页面加载完成前定义了一个变量未赋值它的默认值
是"+object+"默认类型是:"+ typeof(object))
window.onload=function(){
object=88;
alert("此时页面加载完成给未赋值的object赋值int类型88 它会改变为"+object+"此时类型是:"+ typeof(object));
object="hellow";
alert("重新给object赋值为String类型的'hellow' 它会改变为:"+object+"此时类型是:"+ typeof(object))
var a=88;
var b="88";
alert("比较a==b结果为:"+(a==b)+" 比较a===b结果为:"+(a===b));
</script>
(二)、javascript中的 && 运算和 ||运算
<1>、&& 与运算。
有两种情况:
第一种:当表达式全为真的时候。返回最后一个表达式的值。
第二种:当表达式中,有一个为假的时候。返回第一个为假的表达式的值
var a = "abc";
var b = true;
var d = false;
var c = null;
// 示例
alert( a && b ); // true
alert( b && a ); // abc
alert( d && b ); // false
alert( c && b ); // null
alert( b && c ); // null
<2>、&& 与运算。
|| 或运算
第一种情况:当表达式全为假时,返回最后一个表达式的值
第二种情况:只要有一个表达式为真。就会返回第一个为真的表达式的值
||或运算在js实际开发的时候,经常用来防止重复定义,重复定义会覆盖掉前面所有的定义
并且 && 与运算 和 ||或运算 有短路。
短路就是说,当这个&&或||运算有结果了之后 。后面的表达式不再执行
var a = "abc";
var b = true;
var d = false;
var c = null;
alert( d || c ); // null
alert( c || d ); // false
alert( a || d ); // abc
alert( b || d ); // true
<3>Js 中的数组:
格式:
var 数组名 = [];
var arr = []; // 定义一个空的数组
alert(arr.length); // 长度 0
arr[0] = 1;
// javaScript的数组的赋值的取值,和java一样,都是通过数组的下标进行运算
alert(arr[0]); // 数值:1
/*
在javaScript中,当我们通过数组下标给数组元素进行赋值的时候
javaScript的数组会自动的根据赋值的最大下标自动的做扩容的操作。
*/
alert(arr.length); //长度 1
arr[2] = "222";
alert(arr.length); //长度 为 3
alert(arr[1]); // undefined 第二个没有值但是长度已经阔为3
//数组的遍历
for (var i = 0; i < arr.length; i++) {
alert("数组的第" + (i + 1 ) + "个元素值为:" + arr[i]);
}
var arr2 = ["abc",12,true];
alert(arr2.length); // 长度为3
arr2[4] = 12;
alert(arr2.length); // 长度为5
}
</script>
</head>
<body>
<font color="red" size="4px">我是<body>注意:标签 script一般不再这里定义使用</font>
</body>
</html>
四 JS之可变参数arguments
1、arguments相对于Java 中的可变长参数
public void fun( Object … params ){} params是一个接收参数的数组
2、在function内可用arguments[i]来获取传入的可变参数
arguments在函数体内可以直接使用,不需要我们去定义。
3、它可以接收所有的函数参数值,arguments的值跟数组一样
4、在JavaScript中函数在调用的时候,传递的参数会从左到右,依次对函数的参数进行赋值
没有 被赋到值的参数默认值为undefined
如下举例:传入可变个参数
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function sum(){
//定义一个变量保存相加的和
var result = 0;
// 遍历数组arguments
for (var i = 0; i < arguments.length; i++ ) {
// 获取每一个变量相加
var p = arguments[i];
alert(typeof(p)+" 值 "+p);
if ( typeof(p) == "number" ) {
result += p;
}
}
return result;
}
var result = sum(12,88,"100",50);
alert("所求的和为传入的number类型数据之和:"+result);
</script>
</head>
<body>
</body>
</html>