您的位置:首页 > Web前端 > JavaScript

第一章:JavaScript基础---(一)基础语法

2012-11-03 00:12 477 查看
很渴望快速学习完成项目,不希望花费太多的时间来学习一门语言,虽然本文没有详细介绍特性但是以下

代码运行就足以理解JavaScript语法,观察以下代码,复制到文本中用浏览器打开。

JavaScript是大小写敏感的, 这里我们快速的了解它的语法

作为入门练习可以每个代码自行敲打一遍。

1:helloworld,我们写的第一个实例

<script language="JavaScript">
document.write("Hello World!!!");
</script>


2:对话框形式显示helloworld 三种形式

<a href="JavaScript:alert('Hello World!!!')">请单击</a>

<a href="#" onclick="alert('Hello World!!!')">请单击</a>

<a href="JavaScript://" onclick="alert('Hello World!!!')">请单击</a>
3:with关键字用法 --简化代码用
开域语句,表示在with语句中的任何表达式的所属对象或者是类都由with后紧跟的变量所代表
功能:为一段程序建立默认对象。简化代码<br>
<br>格式:
<br>with (<对象>){
<br>  <语句组>
<br>}

<Script>
with (document) {
write ("<br><Li>限时抢购物品:");
write ("<Li>ViewSonic 17\" 显示器。");
write ("<Li>EPSON 打印机。");
}
document.write ("<br>---------------");
document.write ("<Li>限时抢购物品:");
document.write ("<Li>ViewSonic 17\" 显示器。");
document.write ("<Li>EPSON 打印机。");
</Script>
4:变量声明,总是var 开头
<br>JavaScript数据的表示:

<br>整数:由正负号、数字构成,八进制、十进制、十六进制;
<br>浮点数:由正负号、数字和小数点构成,常规记数法、科学记数法;
<br>逻辑值:true、false
<br>字符串值:单引号、双引号
<br>空值:null
<br>未定义值:根本不存在的对象、已定义但没有赋值的量;
<br>
<br>
<script language="JavaScript">
var stdId;
var total=3721;
var notNull=true;
var name="李小龙",sex="先生";

var i=j=0;

var hobby=["听音乐","看电影"];
hobby[2]="123";
var test;
stdId = 2004007;
document.write("变量stdId="+stdId+"<br>");
document.write("变量i="+i+"<br>");
document.write("变量j="+j+"<br>");
document.write("变量name="+name+"<br>");
document.write("变量sex="+sex+"<br>");
document.write("变量notNull="+notNull+"<br>");

document.write("变量hobby="+hobby+"<br>");
document.write("变量hobby[0]="+hobby[0]+"<br>");
document.write("变量hobby[1]="+hobby[1]+"<br>");
document.write("变量hobby[2]="+hobby[2]+"<br>");
document.write("变量hobby[3]="+hobby[3]+"<br>");
document.write("未赋值的变量test="+test+"<br>");
document.write("不存在的数值(0.0/0.0)="+(0.0/0.0)+"<br>");

var t1=1.7976931348623157E+10308
document.write("正数超出范围的值"+t1)

document.write("<br />")

var t2=-1.7976931348623157E+10308
document.write("负数超出范围的值"+t2)
</script>

5:全局变量声明

<Script>
var langJS = "JavaScript"; //langJS是全局变量
test();
function test() {
var langVBS = "VBScript"; //langVBS是局部变量
document.write("<LI>" + langJS);
document.write("<LI>" + langVBS);
}
document.write("<LI>" + langJS);
document.write("<LI>" + langVBS);

</Script>
6:运算符号和加减乘除
<script language="JavaScript">
var x = 11;
var y = 5;

with (document) {
write("x = 11, y = 5");
write("<LI>x + y 是 ", x + y);
write("<LI>x - y 是 ", x - y);
write("<LI>x * y 是 ", x * y);
write("<LI>x / y 是 ", x / y);
write("<LI>x % y 是 ", x % y);
write("<LI>++ x 是 ", ++ x);
write("<LI>-- y 是 ", -- y);
write("<LI>x 是 ", x);
write("<LI>y 是 ", y);
write("<LI>x-- 是 ", x--);
write("<LI>y-- 是 ", y--);
}
</script>

7:++运算

<Script>
var x = y = 3;

with (document) {
write("y++=",(y++),"<br>");
write("++y=",(++y),"<br>");
write("x = 3, y = 5 <br>");
write("若x = y++ 运算之后:");
x = y++;//y→x,y+1→y
write("x 是 ", x, "; y 是 ", y, "<br>");
write("再作x = ++y 运算:");
x = ++y;//y+1→x,y+1→y
write("x 是 ", x, "; y 是 ", y);
}
</Script>
8:逻辑运算符且
&&  ||  !

例1:
<Script>
var t = true;
var f = false;

with(document) {
write("<OL><LI>true && true 的结果是 ", t && t);
write("<LI>true && false 的结果是 ", t && f);
write("<LI>false && true 的结果是 ", f && t);
write("<LI>false && false 的结果是 ", f && f);
write("<LI>true && (1==1) 的结果是 ", t && (1==1));
write("<LI>false && 'A' 的结果是 ", f && 'A');
write("<LI>'A' && false 的结果是 ", 'A' && f);
write("<LI>true && 'A' 的结果是 ", t && 'A');
write("<LI>'A' && true 的结果是 ", 'A' && t);
write("<LI>'A' && 'B' 的结果是 ", 'A' && 'B');
write("<LI>1 && 1 的结果是 ", 1 && 1);
write("<LI>1 && 0 的结果是 ", 1 && 0);
write("<LI>true && 0 的结果是 ", true && 0);
write("<LI>true && 1 的结果是 ", true && 1);
write("<LI>true && '0' 的结果是 ", true && '0');
//&&:有一个不是逻辑值,只要第一个操作数的值为flase,则返回第一个操作数的值flase,否则,返回第二个操作数的值
}
</Script>
9:逻辑运算符 或
<Script>
var t = true;
var f = false;

with(document) {
write("<OL><LI>true || true 的结果是 ", t || t);
write("<LI>true || false 的结果是 ", t || f);
write("<LI>false || true 的结果是 ", f || t);
write("<LI>false || false 的结果是 ", f || f);
write("<LI>true || (1==1) 的结果是 ", t || (1==1));
write("<LI>false || 'A' 的结果是 ", f || 'A');
write("<LI>'A' || false 的结果是 ", 'A' || f);
write("<LI>true || 'A' 的结果是 ", t || 'A');
write("<LI>'A' || true 的结果是 ", 'A' || t);
write("<LI>'A' || 'B' 的结果是 ", 'A' || 'B');
write("<LI>1 || 1 的结果是 ", 1 || 1);
write("<LI>1 || 0 的结果是 ", 1 || 0);
write("<LI>true || 0 的结果是 ", true || 0);
write("<LI>true || 1 的结果是 ", true || 1);
write("<LI>true || '0' 的结果是 ", true || '0');
//||:有一个不是逻辑值,只要第一个操作数为的值true、字符或非零的数字,则返回第一个操作数的值,否则,返回第二个操作数的值
}
</Script>
10:逻辑运算符 取反
<Script>
with(document) {
write("<LI>!true 的结果是 ", !true);
write("<LI>!false 的结果是 ", !false);
write("<LI>!'A' 的结果是 ", !'A');
write("<LI>!0 的结果是 ", !0);
write("<LI>!1 的结果是 ", !1);
write("<LI>!2 的结果是 ", !2);
write("<LI>!'0' 的结果是 ", !'0');
write("<LI>!'1' 的结果是 ", !'1');
write("<LI>!-1 的结果是 ", !-1);
}
</Script>
11:逻辑运算优先级



12:this关键字 this通常指向的是我们正在执行的函数本身,或者是指向该函数所属的对象

<Script>
function validate(obj) {
alert("你输入的值是:"+ obj.value);
} </Script>
请输入任意字符:<BR>
<INPUT TYPE="text" onKeyup="validate(this)">
<BR>
当按钮松开时执行脚本 长按不会触发
13:条件运算符(三目运算符)
<Script>
//forms 集合可返回对文档中所有 Form 对象的引用。
function showSex() {
onOroff = document.forms[0].sex[0].checked
status = (onOroff)? "帅哥" : "美女"
alert("Hello! " + status)
}
</Script>
请输入你的性别:
<FORM >
<INPUT TYPE=radio NAME=sex onClick=showSex()>男生
<INPUT TYPE=radio NAME=sex onClick=showSex()>女生
</FORM>

14:注释语句

<Script>
//单行注释
/*
多行注释
*/

//例:
/***************************************
*             源 码 之 家               *
*        http://www.mycodes.net         *
*      下载:http://www.mycodes.net      *
*     论坛http://www.mycodes.net/bbs    *
*****************************************/
</Script>
15:if.......else......
<Script>
var now = new Date();
var hour = now.getHours();

document.write(now);
document.write("<br>");
if (6 < hour && hour < 18)
document.write ("现在"+hour+"点是白天");
else
document.write ("现在"+hour+"点是晚上");
</Script>
16:if.......else.....if
<Script>
var now = new Date();
var day = now.getDay();
var dayName;

if (day == 0) dayName = "星期日";
else if (day == 1) dayName = "星期一";
else if (day == 2) dayName = "星期二";
else if (day == 3) dayName = "星期三";
else if (day == 4) dayName = "星期四";
else if (day == 5) dayName = "星期五";
else dayName = "星期六";

document.write ("今天是快乐的", dayName);
</Script>
17:while语句

<Script>
var i = 5;

while ( i > 0 ) {
document.write("i = " ,i ,"<BR>");
i--;
}
</Script>
18:do.....while语句

<Script>
var i = 5;

do {
document.write("i = " ,i ,"<BR>");
i--;
} while ( i > 0 )
</Script>
19:for循环语句
<Script>
for ( var i = 5; i > 0; i-- ) {
document.write("i = " ,i ,"<BR>");
}
</Script>
20:for in(一)用法 遍历一个数组的所有子集

<html>
<body>

<script type="text/javascript">
var x
var mycars = new Array()
mycars[0] = "Saab"
mycars[1] = "Volvo"
mycars[2] = "BMW"

for (x in mycars)
{
document.write(mycars[x] + "<br />")
}
</script>

</body>
</html>
21:for in(二)用法 遍历一个对象的所有属性

<br>格式:
<br>
<br>for ( 变量 in 对象 ){
<br>    <语句组>
<br>}
<br>
<br>例:
<br>
<Script>
function member(name, sex) {//构造函数member
this.name = name;
this.sex = sex;
}

function showProperty(obj, objString) {
var str = "";
for (var i in obj)
str += objString + "." + i + " = " + obj[i] + "<BR>";
return str;
}

papa = new member("杨宏文", "男生");//建立对象实例papa
document.write(showProperty(papa, "papa"))
</Script>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: