JavaScript(三)常用内置对象

3.1什么是JavaScript对象
1)JavaScript是一种基于对象的语言,对象是JavaScript中最重要的元素。
2)JavaScript包含多种对象:内置对象、自定义对象、浏览器对象、HTML DOM对象、ActiveX对象
3.2使用对象
1)对象由属性和方法封装而成。
2)属性的引用:使用点“.”运算符、通过下标的方式引用。
3)对象的方法的引用:ObjectName.methods()。
3.3常用内置对象
1)简单数据对象:String、Number、Boolean
2)组合对象:Array、Date、Math
3)复杂对象:Function、RegExp
3.4 String对象
1)创建字符串对象
方式一:var str1 = “hello world”;
方式二:var str2 = new String(“hello world”);
2)String对象的属性:length,例如:alert(str1.length);
3)String对象的方法:
①大小写转换:toLowerCase():转为小写;toUpperCase():转为大写。
例如:var str1=”AbcdEfgh”;
var str2=str1.toLowerCase();alert(str2);//结果为 abcdefgh
var str3=str1.toUpperCase();alert(str3);//结果为 ABCDEFGH
②获取指定字符:charAt(index):返回指定位置index的字符;
charCodeAt(index):返回指定位置index的字符的Unicode编码
 注意事项:下标index从0开始。
例如:var str1=”JavaScript网页教程”;
var str2=str1.charAt(12);alert(str2);//结果为 教
var str3=str1.charCodeAt(12);alert(str3);//结果为 25945
③查询指定字符串:
indexOf(findstr,index):从前往后,从位置index开始查找指定的字符串findstr,并返回出现的首字符的位置。
lastIndexOf(findstr):从后往前,查找指定的字符串findstr,并返回出现的首字符的位置。
 注意事项:index可省略,代表从0开始找。如果没有找到则返回-1。
例如:var str1=”JavaScript网页教程”;
var str2=str1.indexOf(“a”);alert(str2);//结果为 1
var str3=str1.lastindexOf(“a”);alert(str3);//结果为 3
④获取子字符串:substring(start,end):从start开始,到end结束,不包含end。
例如:var str1=”abcdefgh”;
var str2=str1.substring(2,4);alert(str2);//结果为 cd
⑤替换子字符串:replace(oldstr,newstr):返回替换后的字符串。
例如:var str1=”abcde”;
var str2=str1.replace(“cd”,”aaa”);alert(str2);//结果为 abaaae
⑥拆分子字符串:split(bystr):用bystr分割字符串,并返回分割后的字符串数组。
例如:var str1=”一,二,三,四,五,六,日”;
var strArray=str1.split(“,”);alert(strArray[1]);//结果为 二
3.5 String对象与正则表达式
String对象有几个方法可以结合正则表达式使用。
1)方法:
①replace(regexp,”replacestr”):返回替换后的结果。
②match(regexp):返回匹配字符串的数组。
③search(regexp):得到匹配字符串的“首“字符位置的索引。
2)JavaScript中使用正则表达式:使用两个斜杠, / 表达式 / 匹配模式
①正则表达式回顾:\d 或者 [a-z]{3,5}。就是纯文本的表达式,用来表示某种匹配模式。在不同的语言环境下,提供了不同的类,执行或者使用正则表达式,实现文本的各种处理。
②匹配模式:g:global,全局匹配;m:multilin,多行匹配;i:忽略大小写匹配。
例如:var str1=”abc123def”;
var str2=str1.replace(/\d/g,”*”);alert(str2);//abc***def,如果不用全局匹配则只替换一个数字
var array=str1.match(/\d/g);//1,2,3
var index=str1.search(/\d/);alert(index);//3
3)案例
eg1:查找并替换文本框中录入的子字符串 js 为 *


function searchStringAndReplace() { var str = document.getElementById(“txtString”).value;
var count = 0; var index = str.indexOf(“js”, 0);
while (index > -1) { str = str.replace(“js”,”*”); index = str.indexOf(“js”, index + 1); }
document.getElementById(“txtString”).value = str; }
eg2:字符查询与过滤(使用正则表达式)



function stringByRegex() { var str = document.getElementById(“txtString”).value;
var result = str.match(/js/gi);
document.getElementById(“txtString”).value = str.replace(/js/gi, “*”);
alert(“共替换了” + result.length + “处。”); }

3.6 Array对象
一列有多个数据。JavaScript中只有数组没有集合。
1)创建方式
方式一:var arr = [“mary”,10,true];//用中括号!不是大括号;常用;声明的同时并赋值。
方式二:var arr = new Array(“mary”,10,true);//声明的同时并赋值。
方式三:var arr = new Array();或var arr = new Array(7);//可有长度也可没有长度。即便写了长度,也能把第8个数据存入!先声明后赋值。
例如:arr[0] = “mary”; arr[1] = 10; arr[2] = true; alert(arr[3]);//undefined
2)数组的属性:length
3)创建二维数组:通过指定数组中的元素为数组的方式可以创建二维甚至多维数组。
例如:var week=new Array(7); for(var i=0;i<=6;i++){ week=[i]=new Array(2); }
week[0][0]=”星期日”;week[0][1]=”Sunday”; ……
week[6][0]=”星期六”;week[6][1]=”Saturday”;
4)方法:数组转换为字符串
①join(bystr):以bystr作为连接数组中元素的分隔字符,返回拼接后的数组。
②toString():输出数组的内容(以逗号隔开)。
例如:var arr1=[1,2,3,4]; alert(arr1.toString());//1,2,3,4 alert(arr1.join(“-“));//1-2-3-4
5)方法:连接数组,concat(value,…):value作为数组元素连接到数组的末尾(数组连接),返回连接后的数组。
例如:var a=[1,2,3]; var b=a.concat(4,5); alert(a.toString());//1,2,3
alert(b.toString());//1,2,3,4,5
 注意事项:concat方法并不改变原来数组的内容!
6)方法:获取子数组,slice(start,end):截取从start开始到end结束(不包含end)的数组元素。end省略代表从start开始到数组结尾。
例如:var arr1=[‘a’,’b’,’c’,’d’,’e’,’f’,’g’,’h’,];
var arr2=arr1.slice(2,4);alert(arr2.toString());//c,d
var arr3=arr1.slice(4);alert(arr3.toString());//e,f,g,h
7)方法:数组反转,reverse():改变原数组元素的顺序。
例如:var arr1=[32,12,111,444]; alert(arr1.reverse());//444,111,12,32
8)方法:数组排序
①sort():数组排序,默认按照字符串的编码顺序进行排序。
②sort(sortfunc):sortfunc用来确定元素顺序的函数名程。
例如:var arr1=[32,12,111,444]; arr1.sort();alert(arr1.toString());//111,12,32,444
function sortFunc(a,b){ return a-b; }
arr1.sort(sortFunc);alert(arr1.toString());//12,32,111,444
9)案例
eg1:数组倒转与排序




function operateArray(t) {
//拆分为数组
var array = document.getElementById(“txtNumbers”).value.split(“,”);
switch (t) { case 1: array.reverse(); break;
case 2: array.sort(); break;
case 3: array.sort(sortFunc); break; }
alert(array.toString()); }
function sortFunc(a, b) { return a - b; }
eg2:统计文本框中录入的各个字符的各数(使用二维数组)

统计文本框中录入的各字符的个数



function countString(str) { var result = new Array();
for (var i = 0; i < str.length; i++) {//直接循环str
var curChar = str.charAt(i);//得到当前字符
var isHas = false;//声明一个变量,标识char在结果中是否出现过
for (var j = 0; j < result.length; j++) { //循环判断当前字符是否在result中出现过
//如果出现过,则设置标识为true,并增加数量,最后跳出循环
if (curChar == result[j][0])
{ isHas = true; result[j][1]++; break; } }
if (!isHas)//循环result完毕,没有出现过,则加入result
result.push(new Array(curChar, 1)); }
alert(result.toString()); }
eg3:彩票双色球生成器

彩票双色球生成器



function randomNumber(min, max) {//随机数,包含下限,不包含上限
var n = Math.floor(Math.random() * (max - min)) + min; return n; }
function doubleBall() {//彩票双色球
var result = new Array();//声明一个数组,用于存放结果
var i = 0; while (i < 6) {//先产生6个红球
var curCode = randomNumber(1, 34);//先生成一个1到33之间的号码
var isHas = false;//判断该号码是否出现过
for (var j = 0; j < result.length; j++) {
if (result[j] == curCode) { isHas = true; break; } }
if (!isHas) {//没有出现过,则加入且计数器加1
result.push(curCode); i++; } }
result.sort(sortFunc);//产生完6个红球后,先排序,再产生一个蓝球
var info = result.toString(); var blueBall = randomNumber(1, 17);
alert(info + ” | ” + blueBall); //返回结果 }
function sortFunc(a, b) { return a - b; }//排序用的方法
3.7 Math对象
用于执行相关的数学计算。
1)没有构造函数Math()。
2)不需要创建,直接把Math作为对象使用就可以调用其所有属性和方法。如:不需要创建var data=Math.PI; 直接使用Math.PI;像Java中的静态类一样。
3)常用属性:都是数学常数,如:Math.E(自然数)、Math.PI(圆周率)、Math.LN2(ln2)、Math.LN10(ln10)等
4)常用方法:
①三角函数:Math.sin(x)、Math.cos(x)、Math.tan(x)等
②反三角函数:Math.asin(x)、Math.acos(x)等
③计算函数:Math.sqrt(x)、Math.log(x)、Math.exp(x)等
④数值比较函数:Math.abs(x)、Math.max(x,y,…)、Math.random()、Math.round(x)等
 注意事项:
 Math.random():是一个 >=0 且 <1 的正小数
 Math.floor(x):地板,小于等于x,并且与它最接近的整数。注意:将负数舍入为更小的负数,而不是向0进行舍入。
 Math.ceil(x):天花板,返回大于等于x,并且与它最接近的整数。注意:不会将负数舍人为更小的负数,而是向0舍入。
5)案例
eg:随机得到3-9之间的一个整数(包含3,不包含9)
分析:① * (9-3)则得到0-6之间的小数。② +3则得到3-9之间的小数。
function getRandom(){ var min = 3; var max = 9; var seed = Math.random();
var n = Math.floor( seed * (max-min) + min); alert(n); }
3.8 Number对象
Number对象是原始数值的包装对象。
1)创建Number对象
方式一:var myNum=new Number(value);
方式二:var myNun=Number(value);
2)常用方法
①toString:数值转换为字符串。
②toFixed(n):数值转换为字符串,并保留小数点后n位数,多了就截断,四舍五入。少了就用0补足,常用作数值的格式化。比如:
var data=23.56789; alert(data.toFixed(2));//23.57 data=23.5; alert(data.toFixed(2));//23.50
3.9 RegExp正则表达式对象
1)创建正则表达式对象
方式一:var reg1=/^\d{3,6} /;varreg2=newRegExp(\d3,6 ”);
2)JavaScript中,正则表达式的应用分为两类:
一类:和String对象的三个方法结合使用,实现对string的操作,如:replace/match/search
二类:调用正则表达式对象的常用test方法测试,RegExpObject.test(string):如果字符串string中含有与RegExpObject匹配的文本,则返回true,否则返回false
3)案例
eg:输入验证
用户名(3到6位字母数字的组合):


电话号码(6位数字):


function validateUserName(name) {//验证用户名
var reg = /^[a-zA-Z0-9]{3,6} /;//reg是一个对象  
    var isRight = reg.test(name);       if (!isRight){  alert(“录入错误!”);   }      }  
function validateUserPhone(phone) {//验证电话号码  
    var reg = /^\d{6}
/; var isRight = reg.test(phone);
if (!isRight){ alert(“录入错误!”); } }
3.10 Date对象
Data对象用于处理日期和时间。
1)创建Data对象
方式一:var now = new Date();//当前日期和时间
方式二:var now = new Date(“2013/01/01 12:12:12”);
2)常用方法
①读取日期的相关信息:getDay()、getDate()、getMonth()、getFullYear()…
②修该日期:setDay()、setDate()、setMonth()、setHours() ……
③转换为字符串:得到某种格式的字符串显式,常用于页面显式,如:toString()、toDateString()、toLocaleTimeString()
3)案例
eg:计算查询时段
三天内
一周内
function getDateRange(days) {//时间的查询
var end = new Date();//得到当前日期
var endString = end.toLocaleDateString();
end.setDate(end.getDate() - days + 1);//修改日期
var s = “开始日期为:” + end.toLocaleDateString() + “\n”;//显示结果
s += “结束日期为:” + endString; alert(s); }
3.11函数与Function对象
1)函数的概述:函数(方法)是一组可以随时随地运行的语句。Function对象可以表示开发者定义的任何函数。函数实际上是功能完整的对象。
2)函数的定义:function 函数名(参数){ 函数体; return; }
 注意事项:
 由关键字function定义。
 函数名的定义规则与标识符一致,大小写敏感。
 可以使用变量、常量或表达式作为函数调用的参数。
 返回值必须使用return。
3)函数的调用:函数可以通过其名字加上括号中的参数进行调用。如果有多个参数,则参数之间用逗号隔开。如果函数有返回值,则可以声明变量等于函数的结果即可。比如:
function sum(n1,n2){ return n1+n1; } var result=sum(1,1); alert(result);//2
4)JavaScript中,如何创建一个方法
方式一:使用function关键字明文的声明一个方法(最常用,用于功能相关的方法)
例如:function AA(a,b){ alert(a+b); }
方式二:使用Function对象创建函数,语法:
var functionName=new Function(arg1,…argN,functionBody);
最后一个参数是方法体,前面的其它参数是方法的参数。
例如:
function testFunction(){ var f = new Function(“a”,”b”,”alert(a+b);”); f(10,20); }
 注意事项:
 需求:有些方法不需要显式的存在,只是为其他方法里所使用(类似于java中的内部类)。
 缺陷:方法体不能复杂。
方式三:创建匿名函数,语法:
var func=function(arg1,…argN){ func_body; return value; }
例如:var f = function(a,b){ alert(a+b); }
5)案例
eg:数组按数值排序(使用Function对象和匿名函数)

function sortArray() {//使用 Function 对象
var array = [34, 2, 14, 56, 43];
array.sort(new Function(“a”, “b”, “return a-b;”));
alert(array.toString()); }
function sortArray2(){//使用匿名函数
var array=[12,3,45,9];
var f = function(a,b){ return a-b; };
array.sort(f); alert(array.toString()); }
3.12全局函数
全局函数可用于所有内建的JavaScript对象。常用的全局函数有:
1)decodeURI/encodeURI
①encodeURI(str):把字符串作为URI进行编码(大写i)。
②decodeURI(str):对encodeURI()函数编码过的URI进行解码。
例如:function test(){ var s=”http://sss.jsp?name=张三&code=李四”;
var r1=encodeURI(s); var r2=decodeURI(r1); alert(r1); alert(r2); }
2)parseInt/parseFloat
①parseInt(str):强制转换成整数,如果不能转换,则返回NaN。
例如:parseInt(“6.12”)=6(无四舍五入)
②parseFloat(str):牵制转换成浮点数,如果不能转换,则返回NaN。
例如:parseFloat(“6.12”)=6.12
3)isNaN(str):is not a number,判断文本是否为数值,false为数值,true为非数值。
4)eval(str):用于计算某个字符串,以得到结果;或者用于执行其中的JavaScript代码。
 注意事项:eval(str)只接受原始字符串作为参数,如果参数中没有合法的表达式和语句,则抛出异常
例如:var str=”2+3”; alert(str);//2+3 alert(eval(str));//5

5)案例
eg:简单计算器









function calculater(s){
if( s == “=”){//如果单击的是=则计算,否则拼接
var s1 = document.getElementById(“txtNumber”).value;
var r = eval(s1);
document.getElementById(“txtNumber”).value = r;
}else{ document.getElementById(“txtNumber”).value +=s; } }
3.13 Arguments对象
1)arguments是一种特殊对象,在函数代码中,代表当前方法被传入的所有的参数,形成一个数组。
2)在函数代码中,可以使用arguments访问所有参数。
①arguments.length:函数的参数个数; ②arguments.[i]:第i个参数
3)JavaScript中,没有传统意义上的重载(方法名相同,但是参数不同),即:如果方法名相同,则以最后一次定义的为准。如果想在JavaScript中实现类似于重载的效果,就需要使用arguments对象。
4)案例
eg:模拟一个方法的重载


//Javascript 代码中,相同名称的方法如果重复定义,将会用新定义的方法覆盖已有的同名方法,因此,只能创建一个名为 myMethod 的方法,且不需要为该方法定制参数。
function myMethod() {
if (arguments.length == 1) {//计算平方
var n = parseInt(arguments[0]);//避免隐式转换,主动显式转换
alert(n + ” 的平方为:” + n * n); }
else if (arguments.length == 2) {//计算和
var n = parseInt(arguments[0]);
var m = parseInt(arguments[1]);
var result = n + m;
alert(n + ” 与 ” + m + ” 的和为:” + result); } }

你可能感兴趣的:(JavaScript,方法,语言,运算符,元素)