数据类型
JavaScript和其他脚本语言一样,使用时不需要显示指定数据的类型,仅在特殊场合才需要知道某一数据的类型(基本类型、复合类型)
一、基本数据类型 : 字符串型、布尔型、数值型
1.字符串型数据:用引号括起来的文本字符串(由多个字符构成的数据串),单引号、双引号均可,定义字符串时不需要指定类 型 定义方式: var hello = "你好" 或 var hello = '你好'
此处定义一个名为hello的字符串变量,程序执行时系统自动为hello变量采用字符串的处理方式,var是JavaScript中用于定义变 量的关键字
练习:
<script type="text/JavaScript">
var name="毛毛";
var hello='你好';
<!--document.write(name+hello);-->
alert(name+hello);
</script>
JavaScript中不区分字符和字符串,字符也被当做字符串处理,字符串中的字符索引从0开始,字符按顺序存储
常用转义字符
\n 回车换行 \t 制表符
\r 换行 \' 单引号
\" 双引号 \\ \
<script type="text/JavaScript">
var str1="我是一个粉刷匠\n";
var str2='粉刷\t本领强\r';
var str3="我要把那\'小房子\'\r";
var str4="\\刷的很漂亮\n";
var str=str1+str2+str3+str4;
alert(str);
<!--下面一行的输出结果并不是预想中的-->
<!--document.write(str);--> <!--一部分转义字符在输出为HTML文本流时并不发生作用,如制表符、回车换行等-->
</script>
2.数值型数据(JavaScript中不区分整型、浮点型 , 数字型用双精度浮点值来表示数字数据,可以用普通的记法也可以用科学计数法)
数字分为八进制,十进制,十六进制
八进制(以0开头,后跟0-7的数字,没有小数和指数部分)
十进制(可以用普通记法和科学计数法)
10(数字) 10.1(数字) 3e7(科学计数法) 0.3E7(科学计数法)
十六进制(以0X或0x开头,后跟0-F的十六进制数字,没有小数和指数部分)
练习
<script type="text/JavaScript">
var a8=015;
document.write("<li>我是八进制的015 "+ a8 + "<br>");
var a10=10.1;
document.write("<li>我是十进制的10.1 " + a10 + "<br>");
var b10=3e2;
document.write("<li>我是十进制的3e2 " + b10 + "<br>");
var c16=0x3a;
document.write("<li>我是十六进制的0x3a " + c16 + "<br>");
</script>
用科学计数法、十六进制计数法、八进制计数法表示的数字在输出时全部自动转换为普通的十进制形式
2.布尔型(只有"真"(true)和"假"(false)两个值的数据类型)
JavaScript中除了“true”“false”表示真假外,任意非0值就表示真,0值表示假
定义 var b=true; var b=false;
<script type="text/JavaScript">
var bool=true;
if(bool){
document.write("哈哈,真的!<br>");
}
else{
document.write("<p>蠢孩子!")
}
var n=-1;
if(n){
document.write("哈哈,为真!");
}
var m=0;
if(m){
document.write("哈哈,真的!");
}
</script>
二、复合数据类型 (指用户自定义类型或JavaScript内置复合类型,如对象和数组)
对象封装了数据和操作数据的方法
常用内置对象
1.Object(所有对象的基础对象)
var obj=new Object(); 可以使用new运算符来调用对象的构造函数,从而创建一个对象
obj.属性/方法 使用"."运算符来访问已经创建对象的属性和方法
2.Array(数组对象,封装了数组的操作和属性)
3.Date(日期对象)
创建Date对象方法
var date=new Date();
var date=ner Date(val); 创建一个与1970年1月1日午夜间全球标准时间相差val毫秒的日期
var date=new Date(y,m,d,h,min,sec,ms);创建指定年、月、日、时、分、秒、毫秒的日期,其中年、月、日必须给出,其余可选
<script type="text/JavaScript">
var cur=new Date();
alert(cur.getYear()+ "年" + cur.getMonth()+ "月" + cur.getDate() + "日");
cur.setYear(2018);
cur.setMonth(7);
cur.setDate(17);
alert(cur.getYear()+ "年" + cur.getMonth()+ "月" + cur.getDate() + "日");
</script>
Date对象常用方法
getYear() 返回年值
getMonth() 返回月份
getDate() 从 Date 对象返回一个月中的某一天 (1 ~ 31)。
getDay() 从 Date 对象返回一周中的某一天 (0 ~ 6)。
getHours() 返回小时值
getMinutes() 返回分钟值
getSeconds() 返回秒值
setYear() 设置年份
setMonth() 设置月份
setDate() 设置日期
4.Global对象(全局对象,所有的全局函数、全局常量归该对象所有)
全局对象不能用new运算符创建对象实例,所有方法直接调用即可。常用方法:
isNaN(value) 判断value是否是NaN(NaN代表非数字值的特殊值)
parseFloat(string) 返回由字符串转换得到的浮点数
parseInt(string) 返回由字符串转换得到的整数
parseFloat()不解析以非数字字符开头的字符串,数字字符后的字符被忽略
<script type="text/JavaScript">
var gol=NaN;
var judge=isNaN(gol);
document.write("gol的值是否是NaN呢 " + judge +"<br>"); <!--结果为true-->
var n="123";
var m="1.23";
var p="ab123";
var q="1.23ab"
document.write("将字符串n转换为整数输出 " + parseInt(n) + "<br>"); <!--结果为123-->
document.write("将字符串m转换为整数输出 " + parseFloat(m) + "<br>"); <!--结果为1.23-->
document.write("将字符串p转换为整数输出 " + parseInt(p) + "<br>"); <!--结果为NaN-->
document.write("将字符串q转换为整数输出 " + parseFloat(q) + "<br>"); <!--结果为1.23-->
</script>
5.Math对象(数学对象,提供基本的数学函数和常量)
Math对象的方法和属性直接调用而不需要创建Math对象,否则出错。不能用new来创建对象,调用Math对象的方法或属性的方式:Math.属性/方法
常用方法 (sin等方法需要输入用弧度度量的角度值参数)
PI(属性,返回圆周率) SQRT2(属性,返回2的平方根值)
abs(方法,返回绝对值) cos(方法,返回余弦)
sin(方法,返回正弦) max(方法,返回最大值)
min(方法,返回最大值) sqrt(方法,返回给定数平方根)
Tan(方法,返回正切) round(返回与给定数最接近的整数)
log(方法,返回给定数的自然对数) pow(返回给定数的指定次幂)
<script type="text/JavaScript"> <!--给定圆的半径计算面积-->
var pi=Math.PI;
var r=2;
var area=r*r*pi;
var a=-3;
alert("给定半径的圆的面积为 " + area + " " + "a的绝对值是 " + Math.abs(a));
</script>
6.String对象(字符串对象,字符串对象封装了与字符串有关的特性,可以对字符串进行剪切、合并、替换等操作)
调用String对象的方法或属性的形式为 对象名.方法/属性
范例:在文本串中将李白《静夜思》的各个部分提取出来,并格式化输出。标题加粗、文本居中对齐、诗歌正文颜色为灰色
<script type="text/JavaScript"> <!--给定圆的半径计算面积-->
var str="静夜思李白床前明月光,疑似地上霜。举头望明月,低头思故乡。";
var str1=str.substring(0,3);
str1=str1.bold(); <!--设置加粗-->
document.write("<p align=\"center\">" + str1); <!--输出标题-->
str1=str.slice(3,5);
document.write("<br>" + str1); <!--输出作者-->
str1=str.slice(5,17);
str1=str1.fontcolor("gray"); <!--设置颜色-->
document.write("<br>" + str1); <!--输出诗句-->
str1=str.slice(17,29);
str1=str1.fontcolor("gray"); <!--设置颜色-->
document.write("<br>" + str1); <!--输出诗句-->
</script>
7.数组对象(内部对象Array封装了所有和数字相关的方法和属性)
创建数组方式:
a.创建没有任何元素的数组 var a=new Array();
b.给构造函数传递数组元素作为参数 var a=new Array(10,20,"string",40);
给构造函数传递的元素参数可以是任何JavaScript数据类型,各元素类型可以不相同
c.不调用构造函数,直接将元素放入"[]"中 var a=[10,20,"string",40];
d.给构造函数传递元素个数创建具有指定元素个数的数组 var a=new Array(5);
数组元素的下标从0开始,使用 数组名[下标] 的形式访问数组元素
<script type="text/JavaScript"> <!--数组创建及遍历-->
var poets=new Array("王维","李白","杜甫","白居易");
document.write("几大著名诗人:<br>");
for (n in poets){
document.write("<li> " + poets[n]);
}
</script>
虽然创建数组时指明了元素个数,但真正为元素分配内存要等到给元素赋值时
三、其它数据类型
1.函数
JavaScript中的函数充当两个角色,一个是运用在数据类型方面,一个是运用在子程序设计方面
其中定义自定义数据类型方法(使用关键字function定义数据类型TypeName,构造函数带可选参数arg):
function TypeName([arg,...]){
this.arg=arg;
}
练习自定义数据类型
<script type="text/JavaScript">
function MyFun(name,age){
this.name=name;
this.age=age;
}
var me=new MyFun("Alice",18);
alert(me.name + "永远" + me.age + "岁,哈哈哈!");
</script>
2.空值 null 当创建一个对象失败时通常返回一个null值,因此常用null来判断对象的创建或引用过是否成功
<script type="text/JavaScript">
var a=10;
var b=null;
if(a==null){
alert("a = null"+"hiahia");
}
if(b==null){
alert("b = null"+"hiahia");
}
</script>
3.不确定的类型(null表示一个变量拥有空值,而undefined表示一个变量什么都没有得到,连空都没有,在应用中null和undefined是等效的)
<script type="text/JavaScript">
var a=10;
var b=null;
var c;
document.write("a的值为: " + a + "<br>");
document.write("b的值为: " + b + "<br>");
document.write("c的值为: " + c + "<br>");
if(b==c){
document.write("null和undefined等同");
}
else{
document.write("null和undefined不等同");
}
</script>
执行结果
a的值为: 10
b的值为: null
c的值为: undefined
null和undefined等同
4.数据类型的转换(隐式转换、显示转换)
隐式转换:程序运行时,系统根据上下文的需要自动地将数据从一种类型转换为另一种类型
<script type="text/JavaScript">
var age=prompt("请输入您的年龄: ","0");
if(age<=0){
alert("输入的年龄不合法!");
}
else{
alert("您的年龄是: " + age);
}
</script>
上例中用户输入的数据以字符串的形式保存于变量age中,接着将age与0作比较,此时age被自动转换为数值型
显示类型转换:手动转换到目标类型(此事需要用到一些特定的方法,如parseInt,parseFloat等方法)
综合练习
1.编写程序记录学生成绩,要求集中输出位于60-69、70-79、80-89、90-100各个分数段的学生姓名
<script type="text/JavaScript">
var stu=new Array( "小红",60,
"小明",71,
"小花",79,
"小丽",90,
"小芳",88,
"小宇",100
)
var name60_69="";
var name70_79="";
var name80_89="";
var name90_100="";
for(index in stu){
if(index%2==1){ <!--奇数保存了分数-->
if((stu[index]>=60) && (stu[index]<=69)){
name60_69 += stu[index-1] + " ";
}
if((stu[index]>=70) && (stu[index]<=79)){
name70_79 += stu[index-1] + " ";
}
if((stu[index]>=80) && (stu[index]<=89)){
name80_89 += stu[index-1] + " ";
}
if((stu[index]>=90) && (stu[index]<=100)){
name90_100 += stu[index-1] + " ";
}
}
}
document.write("分数统计情况为: <br>");
document.write("<li>分数在60-69之间的学生 : " + name60_69 + "<br>");
document.write("<li>分数在70-79之间的学生 : " + name70_79 + "<br>"); document.write("<li>分数在80-89之间的学生 : " + name80_89 + "<br>");
document.write("<li>分数在90-100之间的学生 : " + name90_100 + "<br");
</script>
2.编写程序将给定文本中的“莲”字加粗用红色标记
<script type="text/JavaScript">
var poem="采莲南塘秋,莲花过人头;低头弄莲子,莲子清如水。今晚若有采莲人,这儿的莲花也算得\"过人头\"了;只不见一些流水的影子";
var newpoem="";
var find;
for(n=0;n<poem.length;n++){
find=poem.charAt(n);
if(find=="莲"){
find=(find.bold()).fontcolor("Green");
newpoem+=find;
}
else{
newpoem+=find;
}
}
document.write("<li>原诗为<br>" + poem + "<br>");
document.write("<li>经修改后的诗句为<br>" + newpoem + "<br>");
</script>