第一章：JavaScript基础---（一）基础语法

最新推荐文章于 2023-04-09 10:14:43 发布

小林爱

最新推荐文章于 2023-04-09 10:14:43 发布

阅读量3.7k

点赞数

分类专栏： html5

本文链接：https://blog.csdn.net/b275518834/article/details/8142649

版权

html5 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

很渴望快速学习完成项目，不希望花费太多的时间来学习一门语言，虽然本文没有详细介绍特性但是以下

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

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

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

1：helloworld，我们写的第一个实例

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

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

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

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

<a href="JavaScript://" οnclick="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：逻辑运算符且

&&　　||　　! 

例１：
<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>

小林爱

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
第一章：JavaScript基础---（一）基础语法

很渴望快速学习完成项目，不希望花费太多的时间来学习一门语言，虽然本文没有详细介绍特性但是以下代码运行就足以理解JavaScript语法，观察以下代码，复制到文本中用浏览器打开。JavaScript是大小写敏感的，这里我们快速的了解它的语法作为入门练习可以每个代码自行敲打一遍。1：helloworld，我们写的第一个实例 document.write("
复制链接

扫一扫