JavaScript对象的四个小练习
实验内容:
- 获取一个长文件路径中的文件名及其后缀。
• 例如:D:\教学工作\web前端程序设计\实验课\第03次\02
基础小案例.html
• 注意:在js中,字符串中的特殊字符需要使用转义字符
进行转义,比如“\”要写成"\" 因为“\”前面的反斜杠是
转义所以“\”只当做一个字符)
• 分析:
– var str = D:\教学工作\web前端程序设计\实验课\第三次
\02基础小案例.html’;
– 想要取的是文件名(02基础小案例)和后缀(html)
• 思路:
– 查找文件名和后缀(lastIndexOf(字符)),查找到‘0’这个
字符和‘h’,然后用str.substr()将其截取出来。
• 知识点:
– substring(start,end)
– substr(start,length)
– lastIndexOf(字符) - 代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文件名</title>
</head>
<script type="text/javascript">
var str='D:\\js\\Demo2\\1.html';
var zero=str.lastIndexOf("0");
var h=str.lastIndexOf("h");
var name=str.substring(zero,h-1);
var hzvv=str.substring(h);
document.write("文件名称为:"+name+"<br>");
document.write("文件后缀名为:"+hzvv+"<br>");
var str1='D:\\js\\Demo2\\1.html';
var gang1=str1.lastIndexOf("\\");
var dian1=str1.lastIndexOf(".");
var name1=str1.substr(gang1+1,7);
var hzvv1=str1.substr(dian1+1,4);
document.write("文件1名称为:"+name1+"<br />");
document.write("文件后缀为:"+hzvv1);
</script>
<body>
</body>
</html>
实验内容:
实验三:JavaScript对象
- 随机选学员:
从以下学员名单中随机选出4个学员:
var arr = [“鹿晗”,“王俊凯”,“蔡徐坤”,“彭于晏”,“周杰伦”,"
刘德华",“赵本山”];
注意:不要有重复的学员 - 代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>随机选学员</title>
<script>
var arr = ["鹿晗", "王俊凯", "蔡徐坤", "彭于晏", "周杰伦", "刘德华", "赵本山"];
var newArr = []; //创建空数组
while (newArr.length < 4) {
//
var num = Math.floor(Math.random() * 7); //这里随机生成0-7,这里数字是可以重复的,num意义是当作arr数组的索引值
if (newArr.indexOf(arr[num]) === -1) {
//这里作用就是判断随机生成arr数组元素在newArr数组中是否存在,不存在则indexOf()值为-1,执行里面代码
newArr.push(arr[num]); //将该值push()方法‘推’到newArr数组中,因为indexOf()结果若不是-1则表示存在该元素,就不会执行这条代码,便实现了学院不重复
}
}
console.log(newArr);
</script>
</head>
<body>
</body>
</html>
实验内容:
实验三:JavaScript对象
- 创建一个自定义构造函数Student,要求
✓ 有4个属性,分别是姓名、性别、年龄、体重,其
中年龄和体重为私有变量;
✓ 给私有变量添加公共的get方法;
✓ 有一个方法show(), 用于显示4个属性值;
✓ 要求定义3个对象,并将信息保存到数组中。 - 代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Student</title>
</head>
<body>
<script>
function Student(name,gender,age,weight){
this.name = name;
this.gender = gender;
var age = age;
var weight = weight;
this.getAge = function(){
return age;
}
this.getWeight = function(){
return weight;
}
this.show = function(){
document.write("名称:"+this.name+"</br>");
document.write("性别:"+this.gender+"</br>");
document.write("年龄:"+this.getAge()+"</br>");
document.write("体重:"+this.getWeight()+"</br>");
}
}
var stu1 = new Student("张三","男","18","60");
var stu2 = new Student("李四","女","25","48");
var stu3 = new Student("王五","男","56","75");
stu1.show();
var Arr =[[],[]];
var stuNum;
for (var i = 0; i < 3; i++) {
Arr[i]=new Array();
if(i==0)
stuNum = stu1;
else if (i==1)
stuNum = stu2;
else
stuNum = stu3;
Arr[i][0]=stuNum.name;
Arr[i][1]=stuNum.gender;
Arr[i][2]=stuNum.getAge();
Arr[i][3]=stuNum.getWeight();
}
document.write("数组为:<br>");
for(var i = 0;i < 3;i++){
for(var j = 0;j < 4;j++){
document.write(Arr[i][j]+" ");
}
document.write("<br>");
}
</script>
</body>
</html>
实验内容:
实验三:JavaScript对象
- 用构造函数来实现网页计算器
- 代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>计算机</title>
<script type="text/javascript">
function Cal(){
this.read=function(){
this.a=parseInt(prompt('请输入a的值',0));
this.b=parseInt(prompt('请输入b的值',0));
}
this.sum=function(){
return this.a+this.b;
}
this.sub=function(){
return this.a-this.b;
}
this.mul=function(){
return this.a*this.b;
}
this.div=function(){
if(this.b==0){
alert("除数不能为0!!!!");
}else
return this.a/this.b;
}
}
var cal=new Cal();
cal.read();
var fuhc=prompt("运算符号为:",'+');
switch(fuhc){
case '+':
alert("相加为"+cal.sum());
break;
case '-':
alert("相减为"+cal.sub());
break;
case '*':
alert("相乘为"+cal.mul());
break;
case '/':
alert("相除为"+cal.div());
default:
alert("符号不正确!!!");
break;
}
</script>
</head>
<body>
</body>
</html>