JavaScript基础教程:数据类型、运算符与事件处理详解

作者:像素猫时间:2026-10-23 06:46:58浏览:303

本文系统介绍JavaScript的核心基础,涵盖Number、String、Boolean等数据类型及Undefined与Null的区别。详细解析各类运算符、对象操作语句与函数定义方法,并深入讲解全局内置函数的使用。最后通过匿名函数与手工触发示例,阐明JavaScript事件处理机制及顶级对象关系,适合初学者掌握JS编程基础。

JavaScript数据类型概述

JavaScript的数据类型


Number类型包含整数和浮点数。


String类型用于表示字符数据,在JavaScript中不区分单个字符与字符串。


任何字符或字符串均可使用双引号或单引号进行包裹。


Boolean类型表示布尔值。


Undefined类型用于表示不存在或未被赋初值的变量或对象属性,例如:


var name; 此时变量name的值即为Undefined。


Null类型表示空值,通常将Undefined与Null视为等同处理。


Function类型即函数,可通过new操作符和构造函数Function()动态创建具备特定功能的函数并添加函数体,例如:


var myFunction = new Function()


{

staments ;


} ;

组合类型包括Array和Object。


Array类型用于存储包含基本数据和组合数据的序列,数组本质上即为Array对象。


var score = [56,34,23,76,45] ;


Object类型是可包含基本数据和组合数据的组合类型,


对象的成员作为对象的属性,对象的成员函数作为对象的方法。



JavaScript运算符与对象操作

JavaScript中的运算符:


空运算符对应的关键字为"void",其作用是定义一个表达式,但该表达式不返回任何值。


对象运算符包括点运算符、new选择符、delete运算符以及()运算符。


typeof运算符用于表明操作数的数据类型,返回值类型为字符串,例如:


var myString = typeof(data) ;



with对象操作语句用于简化对象属性和方法的引用过程,其语法结构如下:


with(object)


{

statements ;


}

for...in语句用于进行对象的循环操作,例如:


for(变量名 in 对象名)


{

statements ;


}

函数定义与全局内置函数

函数的定义如下:



function funcName([parameters])


{

statements ;


[return 表达式;]


}

全局函数:JavaScript中定义了许多全局(内建)函数,在编程过程中可直接调用。


parseInt():将字符串转换为整数。


parseFloat():将字符串转换成浮点数。


escape():将一些特殊字符转换成ascii码。


unescape():将ascii码转换成字符。



JavaScript脚本语言中所有的数据类型、数组等均可作为对象对待,


函数也不例外。可以使用new操作符和Function对象的构造函数Function()


来生成指定规则的函数,其基本语法如下:


var funcName = new Function(arguments,statements;) ;



事件处理机制与对象关系

JavaScript的事件处理:


JavaScript脚本处理事件主要可通过匿名函数、显式声明、手工触发等方式进行。


匿名函数示例:


document.MyForm.MyButton.onclick=new Function()


{

alert("Your Have clicked me!");


}

手工触发:


通过其他元素的方法来触发一个事件而不需要通过用户的动作来触发该事件,例如:



<script language="JavaScript" type="text/javascript">


<!--

function MyImageA()


{

document.all.MyPic.src="2.jpg";


}

function MyImageB()


{

document.all.MyPic.src="1.jpg";


}
-->

</script>



<script language="JavaScript" type="text/javascript">


<!--

//没有放在函数当中被其它控件调用


document.all.MyPic.onmouseover=MyImageA;


document.all.MyPic.onmouseout=MyImageB;


-->

</script>



顶级对象之间的关系:


打开一个网页时生成对象的顺序为:window->screen,navigator,location,history,frames[],document.


1

2下一页阅读全文

作者最新文章