本文深入探讨JavaScript的基础知识，包括变量定义、字符串操作、数值计算、数组处理等关键概念，并通过实例展示了条件语句、循环控制及函数应用，适合初学者快速掌握JavaScript编程技巧。
1.输出
<script language="javascript"> var myName = "isaac"; document.write(myName); </script>
2.操作字符串
<script language="javascript"> var sMyString = "Peking University"; document.write(sMyString.slice(1,3) + "<br>"); //字符串从包含1开始,但不包括3位置 document.write(sMyString.substring(1,3) + "<br>"); //字符串从包含1开始,但不包括3位置 document.write(sMyString.slice(4) + "<br>"); //字符串从包含4位置开始以后所有字符 document.write(sMyString + "<br>"); //不改变原字符串 </script>
<script language="javascript"> var sMyString = "Peking University"; document.write(sMyString.slice(2,-4) + "<br>"); //从包含2的位置开始,University从右往左数去掉4个长度的字符（king Univer） document.write(sMyString.substring(2,-3) + "<br>"); //substring(2,-3)等同于substring(2,0)也等同于substring(0,2)（Pe） document.write(sMyString.substring(2,0) + "<br>"); //substring(2,0)等同于substring(0,2)（Pe） document.write(sMyString + "<br>"); </script>
3.查找字符串
<script language="javascript">
var sMyString = "Peking University";
document.write(sMyString.indexOf("i")+"<br>");
//从前往后（3）
document.write(sMyString.indexOf("i",3)+"<br>");
//可选参数，从第几个字符开始往后找（3）
document.write(sMyString.lastIndexOf("i")+"<br>");
//从后往前（14）
document.write(sMyString.lastIndexOf("i",3)+"<br>");
//可选参数，从第几个字符开始往前找（3）
document.write(sMyString.lastIndexOf("V")+"<br>");
//大写“V”找不到，返回-1（-1）
</script>
4.数值计算
<script language="javascript"> var mynum1 = 23.345; var mynum2 = 45; var mynum3 = -34; var mynum4 = 9e5; //科学计数法 alert(mynum1 + " " + mynum2 + " " + mynum3 + " " + mynum4); </script>
<script language="javascript"> var fNumber = 895.4; //toExponential() 方法可把对象的值转换成指数计数法。 //NumberObject.toExponential(num) //num 必需。规定指数计数法中的小数位数，是 0 ~ 20 之间的值， //包括 0 和 20，有些实现可以支持更大的数值范围。如果省略了该参数， //将使用尽可能多的数字。 alert(fNumber.toExponential(1)); //（9.0e+2） alert(fNumber.toExponential(2)); //（8.95e+2） </script>
5.布尔型
<script language="javascript">
var married = true;
alert("1." + typeof(married)); //（boolean）
married = "true";
alert("2." + typeof(married)); //（string）
</script>
6.类型转换
<script language="javascript"> var a = 3; var b = a + ""; var c = a.toString(); var d = "student" + a; alert(typeof(a) + " " + typeof(b) + " " + typeof(c) + " " + typeof(d)); //（number string string string） </script>
7.toString()方法
<script language="javascript"> //objectname.toString([radix]) //其中objectname是必选项。要得到字符串表示的对象。 //radix是可选项。指定将数字值转换为字符串时的进制。 var a=11; document.write(a.toString(2) + "<br>"); //（1011） document.write(a.toString(3) + "<br>"); //（102） document.write(a.toString(8) + "<br>"); //（13） document.write(a.toString(16) + "<br>"); //（b） </script>
8.parseInt()方法
<script language="javascript">
//parseInt() 函数可解析一个字符串，并返回一个整数。
//parseInt(string, radix)
//string 必需。要被解析的字符串。
//radix 可选。表示要解析的数字的基数。该值介于 2 ~ 36 之间。
//如果省略该参数或其值为 0，则数字将以 10 为基础来解析。
//如果它以 “0x” 或 “0X” 开头，将以 16 为基数。
//如果该参数小于 2 或者大于 36，则 parseInt() 将返回 NaN。
document.write(parseInt("4567red") + "<br>");
//（4567）
document.write(parseInt("53.5") + "<br>");
//（53）
document.write(parseInt("0xC") + "<br>");
//直接进制转换 （12）
document.write(parseInt("isaacshun@gmail.com") + "<br>");
//（NaN）
</script>
<script language="javascript">
document.write(parseInt("AF",16) + "<br>"); //（175）
document.write(parseInt("11",2) + "<br>"); //（3）
document.write(parseInt("011") + "<br>"); //0开头，默认为八进制（9）
document.write(parseInt("011",8) + "<br>"); //（9）
document.write(parseInt("011",10) + "<br>"); //指定为十进制（11）
</script>
9.parseFloat()方法
<script language="javascript">
//parseFloat() 函数可解析一个字符串，并返回一个浮点数。
document.write(parseFloat("34535orange") + "<br>"); //（34535）
document.write(parseFloat("0xA") + "<br>"); //（0）
//不再有默认进制，直接输出第一个字符“0”
document.write(parseFloat("435.34") + "<br>"); //（435.34）
document.write(parseFloat("435.34.564") + "<br>"); //（435.34）
document.write(parseFloat("isaacshun@gmail.com") + "<br>"); //NaN
</script>
10.数组
<script language="javascript">
var aMap = new Array("China","USA","Britain");
alert(aMap.length + " " + aMap[2]); //（3 Britain）
</script>
<script language="javascript">
var aMap = new Array("China","USA","Britain");
aMap[20] = "Korea";
alert(aMap.length + " " + aMap[10] + " " + aMap[20]);
//（21 undefined Korea）
</script>
<script language="javascript"> var aMap = ["China","USA","Britain"]; alert(aMap.toString() + " " + typeof(aMap.toString())); //（China,USA,Britain string） </script>
11.split()方法
<script language="javascript">
//split() 方法用于把一个字符串分割成字符串数组。
//stringObject.split(separator,howmany)
//separator 必需。字符串或正则表达式，
//从该参数指定的地方分割 stringObject。
//howmany 可选。该参数可指定返回的数组的最大长度。
//如果设置了该参数，返回的子串不会多于这个
//参数指定的数组。如果没有设置该参数，整个
//字符串都会被分割，不考虑它的长度。
var sFruit = "apple,pear,peach,orange";
var aFruit = sFruit.split(",");
alert(aFruit.join("--"));
//join() 方法用于把数组中的所有元素放入一个字符串。
//元素是通过指定的分隔符进行分隔的。
//arrayObject.join(separator)
//separator 可选。指定要使用的分隔符。
//如果省略该参数，则使用逗号作为分隔符。
//（apple--pear--peach--orange）
</script>
12.reverse()方法
<script language="javascript"> //reverse() 方法用于颠倒数组中元素的顺序。 //arrayObject.reverse() //该方法会改变原来的数组，而不会创建新的数组。 var aFruit = ["apple","pear","peach","orange"]; alert(aFruit.reverse().toString()); //（orange,peach,pear,apple） </script>
<script language="javascript">
var sMyString = "abcdefg";
alert(sMyString.split("").reverse().join(""));
//split("")将每一个字符转为一个数组元素
//reverse()反序数组的每个元素
//join("")再最后将数组无连接符的转为字符串
//（gfedcba）
</script>
13.sort()方法
<script language="javascript"> //sort() 方法用于对数组的元素进行排序 //arrayObject.sort(sortby)参数 描述 //sortby 可选。规定排序顺序。必须是函数 var aFruit = ["pear","apple","peach","orange"]; aFruit.sort(); alert(aFruit.toString()); //（apple,orange,peach,pear） </script>
14.pop()方法
<script language="javascript">
//pop() 方法用于删除并返回数组的最后一个元素
//arrayObject.pop()返回值
//arrayObject 的最后一个元素。
//pop() 方法将删除 arrayObject 的最后一个元素
//把数组长度减 1，并且返回它删除的元素的值
//如果数组已经为空，则 pop() 不改变数组，并返回 undefined 值。
var stack = new Array();
stack.push("red");
stack.push("green");
stack.push("blue");
document.write(stack.toString() + "<br>");
var vItem = stack.pop();
document.write(vItem + "<br>");
document.write(stack.toString());
//（red,green,blue）
//（blue）
//（red,green）
</script>
15.判断
<script language="javascript">
document.write("Pear" == "Pear"); //（true）
document.write("<br>");
document.write("Apple" < "Orange"); //（true）
document.write("<br>");
document.write("apple" < "Orange"); //（false）
</script>
<script language="javascript">
document.write(3>2 && 4>3); //（true）
document.write("<br>");
document.write(3>2 && 4<3); //（false）
document.write("<br>");
document.write(4<3 || 3>2); //（true）
document.write("<br>");
document.write(!(3>2)); //（false）
</script>
16.if语句
<script language="javascript">
//Number 对象是原始数值的包装对象
//创建 Number 对象的语法：
//var myNum=new Number(value);
//var myNum=Number(value);
//参数 value 是要创建的 Number 对象的数值，或是要转换成数字的值。
//返回值
//当 Number() 和运算符 new 一起作为构造函数使用时
//它返回一个新创建的 Number 对象
//如果不用 new 运算符，把 Number() 作为一个函数来调用
//它将把自己的参数转换成一个原始的数值
//并且返回这个值（如果转换失败，则返回 NaN）
//首先获取用户的一个输入，并用Number()强制转换为数字
var iNumber = Number(prompt("输入一个5到100之间的数字", ""));
if(isNaN(iNumber)) //判断输入的是否是数字
document.write("请确认你的输入正确");
else if(iNumber > 100 || iNumber < 5) //判断输入的数字范围
document.write("你输入的数字范围不在5和100之间");
else
document.write("你输入的数字是:" + iNumber);
</script>
17.switch语句
<script language="javascript">
iWeek = parseInt(prompt("输入1到7之间的整数",""));
switch(iWeek){
case 1:
document.write("Monday");
break;
case 2:
document.write("Tuesday");
break;
case 3:
document.write("Wednesday");
break;
case 4:
document.write("Thursday");
break;
case 5:
document.write("Friday");
break;
case 6:
document.write("Saturday");
break;
case 7:
document.write("Sunday");
break;
default:
document.write("Error");
}
</script>
18.while语句
<script language="javascript">
var i=iSum=0;
while(i<=100){
iSum += i;
i++;
}
alert(iSum); //（5050）
</script>
19.do..while语句
<script language="javascript">
var aNumbers = new Array();
var sMessage = "你输入了:\n";
var iTotal = 0;
var vUserInput;
var iArrayIndex = 0;
do{
vUserInput = prompt("输入一个数字，或者'0'退出","0");
aNumbers[iArrayIndex] = vUserInput;
iArrayIndex++;
iTotal += Number(vUserInput);
sMessage += vUserInput + "\n";
}while(vUserInput != 0) //当输入为0（默认值）时退出循环体
sMessage += "总数:" + iTotal;
alert(sMessage);
</script>
20.for语句
<script language="javascript">
var aNumbers = new Array();
var sMessage = "你输入了:\n";
var iTotal = 0;
var vUserInput;
var iArrayIndex = 0;
do{
vUserInput = prompt("输入一个数字，或者'0'退出","0");
aNumbers[iArrayIndex] = vUserInput;
iArrayIndex++;
}while(vUserInput != 0) //当输入为0（默认值）时退出循环体
//for循环遍历数组的常用方法：
for(var i=0;i<aNumbers.length;i++){
iTotal += Number(aNumbers[i]);
sMessage += aNumbers[i] + "\n";
}
sMessage += "总数:" + iTotal;
alert(sMessage);
</script>
21.break语句
<script language="javascript">
var aNumbers = new Array();
var sMessage = "你输入了:<br>";
var iTotal = 0;
var vUserInput;
var iArrayIndex = 0;
do{
vUserInput = Number(prompt("输入一个数字，或者'0'退出","0"));
if(isNaN(vUserInput)){
document.write("输入错误，请输入数字，'0'退出<br>");
break; //输入错误直接退出整个do循环体
}
aNumbers[iArrayIndex] = vUserInput;
iArrayIndex++;
}while(vUserInput != 0) //当输入为0（默认值）时退出循环体
//for循环遍历数组的常用方法：
for(var i=0;i<aNumbers.length;i++){
iTotal += Number(aNumbers[i]);
sMessage += aNumbers[i] + "<br>";
}
sMessage += "总数:" + iTotal;
document.write(sMessage);
</script>
22.continue语句
<script language="javascript">
var aNumbers = new Array();
var sMessage = "你输入了:<br>";
var iTotal = 0;
var vUserInput;
var iArrayIndex = 0;
do{
vUserInput = Number(prompt("输入一个数字，或者'0'退出","0"));
if(isNaN(vUserInput)){
alert("输入错误，请输入数字，'0'退出");
continue; //输入错误则退出当前循环，继续下一次循环
}
aNumbers[iArrayIndex] = vUserInput;
iArrayIndex++;
}while(vUserInput != 0) //当输入为0（默认值）时退出循环体
//for循环遍历数组的常用方法：
for(var i=0;i<aNumbers.length;i++){
iTotal += Number(aNumbers[i]);
sMessage += aNumbers[i] + "<br>";
}
sMessage += "总数:" + iTotal;
document.write(sMessage);
</script>
23.九九乘法表
<body bgcolor="#e0f1ff">
<table cellpadding="6" cellspacing="0" style="border-collapse:collapse; border:none;">
<script language="javascript">
for(var i=1;i<10;i++){ //乘法表一共九行
document.write("<tr>"); //每行是table的一行
for(j=1;j<10;j++) //每行都有9个单元格
if(j<=i) //有内容的单元格
document.write("<td style='border:2px solid #004B8A;
background:#FFFFFF;'>"+i+"*"+j+"="+(i*j)+"</td>");
else //没有内容的单元格
document.write("<td style='border:none;'></td>");
document.write("</tr>");
}
</script>
</table>
</body>
24.arguments对象
<script language="javascript">
//arguments 对象
//在函数代码中，使用特殊对象 arguments
//开发者无需明确指出参数名，就能访问它们。
//检测参数个数
//还可以用 arguments 对象检测函数的参数个数
//引用属性 arguments.length 即可。
function ArgsNum(){
return arguments.length;
}
document.write(ArgsNum("isaac",25) + "<br>");
//（2）
document.write(ArgsNum() + "<br>");
//（0）
document.write(ArgsNum(3) + "<br>");
//（1）
</script>
<script language="javascript">
function fnAdd(){
if(arguments.length == 0)
return;
else if(arguments.length == 1)
return arguments[0] + 5;
else{
var iSum = 0;
for(var i=0;i<arguments.length;i++)
iSum += arguments[i];
return iSum;
}
}
document.write(fnAdd(45) + "<br>");
//（50）
document.write(fnAdd(45,50) + "<br>");
//（95）
document.write(fnAdd(45,50,55,60) + "<br>");
//（210）
</script>
25.杨辉三角
<script language="javascript">
function Combination(m,n){
if(n==0) return 1; //每行第一个数为1
else if(m==n) return 1; //最后一个数为1
//其余都是上一行相邻元素相加而来
else return Combination(m-1,n-1)+Combination(m-1,n);
}
function Pascal(n){ //杨辉三角，n为行数
for(var i=0;i<n;i++){ //一共n行
for(var j=0;j<=i;j++)
//每行数字的个数即为行号，例如第一行1个数，第二行2个数
document.write(Combination(i,j)+" ");
document.write("<br>");
}
}
Pascal(10); //直接传入希望得到的杨辉三角的行数
</script>
26.Date对象
<script language="javascript"> var myDate1 = new Date(); //运行代码前的时间 for(var i=0;i<3000000;i++); var myDate2 = new Date(); //运行代码后的时间 alert(myDate2-myDate1); </script>
<script language="javascript">
var oMyDate = new Date();
var iYear = oMyDate.getFullYear();
var iMonth = oMyDate.getMonth() + 1; //月份是从0开始的
var iDate = oMyDate.getDate();
var iDay = oMyDate.getDay();
switch(iDay){
case 0:
iDay = "星期日";
break;
case 1:
iDay = "星期一";
break;
case 2:
iDay = "星期二";
break;
case 3:
iDay = "星期三";
break;
case 4:
iDay = "星期四";
break;
case 5:
iDay = "星期五";
break;
case 6:
iDay = "星期六";
break;
default:
iDay = "error";
}
document.write("今天是" + iYear + "年" + iMonth +"月" + iDate + "日," + iDay);
</script>
<script language="javascript">
function disDate(oDate, iDate){
var ms = oDate.getTime(); //换成毫秒数
ms -= iDate*24*60*60*1000; //计算相差的毫秒数
return new Date(ms); //返回新的时间对象
}
var oBeijing = new Date(2008,7,8);
var iNum = 100; //前100天
var oMyDate = disDate(oBeijing, iNum);
document.write(oMyDate.getFullYear()+"年"+(oMyDate.getMonth()+1)
+"月"+oMyDate.getDate()+"日" + "距离"+oBeijing.getFullYear()+
"年"+(oBeijing.getMonth()+1)+"月"+oBeijing.getDate()+
"日为"+iNum+"天");
</script>
27.Math.random()
<script language="javascript">
//Math 对象用于执行数学任务
//random() 返回 0 ~ 1 之间的随机数
function selectFrom(iFirstValue, iLastValue){
var iChoices = iLastValue - iFirstValue + 1; //计算项数
return Math.floor(Math.random()*iChoices+iFirstValue);
}
var iNum = selectFrom(2,99); //随机选择数字
var aFruits = ["apple","pear","peach","orange","watermelon","banana"];
//随机选择数组元素
var sFruit = aFruits[selectFrom(0,aFruits.length-1)];
alert(iNum + " " + sFruit);
</script>
28.检测浏览器和操作系统
<script language="javascript">
//Navigator 对象包含有关浏览器的信息
var sUserAgent = navigator.userAgent;
//检测Opera、KHTML
var isOpera = sUserAgent.indexOf("Opera") > -1;
var isKHTML = sUserAgent.indexOf("KHTML") > -1 ||
sUserAgent.indexOf("Konqueror") > -1 || sUserAgent.indexOf
("AppleWebKit") > -1;
//检测IE、Mozilla
var isIE = sUserAgent.indexOf("compatible") > -1 &&
sUserAgent.indexOf("MSIE") > -1 && !isOpera;
var isMoz = sUserAgent.indexOf("Gecko") > -1 && !isKHTML;
//检测操作系统
var isWin = (navigator.platform == "Win32") || (navigator.platform
== "Windows");
var isMac = (navigator.platform == "Mac68K") || (navigator.platform
== "MacPPC") || (navigator.platform == "Macintosh");
var isUnix = (navigator.platform == "X11") && !isWin && !isMac;
if(isOpera) document.write("Opera ");
if(isKHTML) document.write("KHTML ");
if(isIE) document.write("IE ");
if(isMoz) document.write("Mozilla ");
if(isWin) document.write("Windows");
if(isMac) document.write("Mac");
if(isUnix) document.write("Unix");
</script>
扫一扫
426
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
