魔鬼字典 JavaScript 笔记代码比较多乱

作者：bea

//2005中ctrl+J 有可能出提示 //文本编辑出注释的快捷键名词解释： { //Java: 爪哇语言, 在因特网世界范围的 web 网页运转的以网络为基础的编程语言 (计算机用语) //Script : 手稿, 剧本, 手迹 //cs结构：客户端应用程序，用户需要下载客户端，例如QQ //BS结构：浏览器应用程序，具有远程服务器，例如网页脚本语言：解释性语言，不进行编译，只在运行至相应代码时进行解释 } 完整的JavaScript组成 { 核心：ECMAScript 文档对象模型：DOM /*Document/*文件*/ Object Model*/ 浏览器对象模型：BOM /*Browser /*浏览器*/ Object Model*/ } JavaScript作用 { 提供用户交互动态更改内容数据验证 } //建站：文件→新建→网站→ASP.NET 网站→位置（文件系统）→语言（Visual C#）→路径（添加合适路径储存网页） //添加HTML网页：（在资源管理器）添加新项→HTML页→起名→确定 //自动生成的HTML中第一行（<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">）表示生成文档类型 //添加script标签： { 位置：可以添加在任何位置，但是一般添加在<head></head>标签中格式：类型： { 内嵌脚本：放在<head></head>标签中并且有JavaScript文本例子：<script type="text/javascript" language="javascript">此处添加JavaScript文本</script> ↑ 文本类型外挂脚本（建议使用）：放在<head></head>标签中，没有方法体，只有地址例子：<head> <title>无标题页</title> <script type="text/javascript" language="javascript" src="waigua.js"> </script> ↑ </head> 地址扩展名：.js 添加→添加新项→JScript文件→起名→添加 JScript文件中的内容：document.write("能看见呢？"); } } //方法 { document: document.write("这是我的第一个Js文本") /*相当于Console.WriteLine*/ 声明变量： var 例子：var number=55; 强制转换类型： { parseFloat(ppp)/*强制转换为float类型，ppp为变量名*/ !注意：parseFloat的拼写和大小写，如果在页面加载时出现错误则程序不向下运行! Boolean()强制转换,当参数为空字符串和null时，得到false ：例子: document.write(Boolean(100)+"<br/>"); /*强烈注意Boolean的大小写!!!*/ var color="violet"; document.write(color.length,"<br/>"); /*强烈注意length的大小写!!!*/ var num=10; document.write("10的二进制数为",num.toString(2),"<br/>"); 10的二进制数为1010 /*强烈注意toString的大小写!!!*/ document.write("10的八进制数为",num.toString(8),"<br/>"); 10的八进制数为12 document.write("10的十进制数为",num.toString(10),"<br/>"); 10的十进制数为10 document.write(Number(testFunction())+"<br/>"); NaN /*NaN:非数字*/ document.write(Number("123.12")+"<br/>"); 123.12 document.write(Number(false)+"<br/>"); 0 document.write(Number(true)+"<br/>"); 1 document.write(parseInt("10")+"<br/>"); 10 /*parse：解析; 符合语法*/ document.write(parseInt("56.6")+"<br/>"); 56 var str="marssion"; /*typeof运算符，返回变量的类型*/ document.write(typeof(str)+"<br/>"); 显示：string var temp; document.write(typeof(temp)+"<br/>"); 显示：undefined /*undefined : 未定义的*/ var myObject={x:0,y:0}; document.write(typeof(myObject)+"<br/>"); 显示： object document.write(typeof(null)+"<br/>"); 显示： object /*ECMAScript沿用了javascript中最初的一个错误，现在null被认为是对象的占位符,所以返回object，从技术上来讲仍是原始值。*/ var oTemp; document.write((oTemp==undefined)+"<br/>"); 显示： true /*注意在比较时要加（）否则比较时会把"<br/>"也加进去*/ function testFunction(){} //如果函数没有实现则返回undefined值 document.write((testFunction()==undefined)+"<br/>"); 显示：true /*函数给调用所以给加（）*/ document.write((null==undefined)+"<br/>"); 显示： true } } //调用函数 { function a(Sname,Smessage) /*格式： function 函数名（参数1，参数2）{函数体} 参数在定义时直接给名字就行了不需要指定类型*/ { return Sname+Smessage; } var b=a("William","Welcome"); document.write(b); } //if语句 { var num=10; var num1="10"; if(num==num1) { document.write("相等"); /*在比较不同类型的数据时，系统会自动的把两者的类型统一，或者把string类型转换成int或者把int转换成string再判断两者的关系*/ } if(num!=num1) { document.write("不相等"); } } //for语句 { for(var a=1,b=0;a<101;a++) /*输出的是：5050*/ { b+=a; } document.write(b); } //while语句 { var a=1;var b=0; /*输出的是：5050*/ while(a<101) { b+=a; a++; } document.write(b); } //do while 语句 { var a=1; /*输出的是：5050*/ var b=0; do { b+=a; a++; }while(a<101); document.write(b); } //alert 方法和自定义属性自定义object类型的变量 delete方法 { var o=new Object(); /*定义一个oject类型的变量*/ o.name="hellow word"; /*定义属性*/ alert(o.name); /*alert ：提防的，警惕的/*调用此方法弹出一个警告messagebox，（）中写的是要显示的信息*/*/ delete(o.name); /*delete 方法将引用变量的指针打断*/ alert(o.name); /*o.name又变回undefined类型*/ } //全等运算符（===） { var sNum="55"; var tNum=55; document.write(sNum==tNum,"<br />"); 显示： true document.write(sNum===tNum,"<br />"); 显示： false /*“==”会将比较的双方自动类型转换成一样的类型再进行比较，“===”不会类型转换直接比较，int类型自然不等于string类型所以不相等*/ document.write(sNum!=tNum,"<br />"); 显示： false document.write(sNum!==tNum,"<br />"); 显示： true } //switch { var date=new Date(); /*声明一个data类型的变量*/ var time=date.getDay(); /*获得系统的当前日期*/ switch(time) { case 0: document.write("星期日"); break; case 1: document.write("星期一"); break; case 2: document.write("星期二"); break; case 3: document.write("星期三"); break; case 4: document.write("星期四"); break; case 5: document.write("星期五"); break; case 6: document.write("星期六"); break; } } /**/↑↓←→ //arguments { function a(aa,bb,cc) { if(arguments.length==1) /*arguments.length属性：计算调用函数时传过来的参数个数，可以模拟参数重载*/ { document.write(aa+"<br/>"); /*argument[0] argument[1] argument[3] 能够代表（）中的参数*/ } else if(arguments.length==2) { document.write(aa+"~~~~~"+bb+"<br/>"); } else if(arguments.length==3) { document.write(aa+" "+bb+" "+cc+"<br/>"); } } a("william"); 显示：william a("william","welcome"); 显示：william~~~~~welcome a("william","welcome","myhouse"); 显示：william welcome myhouse } //with { var sMessage="hello world"; /*用了with后{}中不用再打相应的变量名了*/ with(sMessage) { document.write(toUpperCase(),"<br />"); 显示：HELLO WORLD /*toUpperCase()方法是强打上去的，没有显示，所以要特别注意大小写*/ document.write(length,"<br />"); 显示：11 /*length属性是强打上去的，没有显示，所以要特别注意大小写*/ } } //void用法 /*没有返回值的*/ { <body> <a href="javascript:void(window.open('about:blank'))">单击一下下</a> /*这是一个超级连接，打开一个新的窗体，不覆盖老窗体，如果没有void超级连接被点后“单击一下下”就会变成“[object]”有了void就不会变了*/ </body> } //for in 用法 /*用于枚举对象的属性*/ { var o=new Object(); o.name="nameshuxing"; o.age=21; o.gender="nan"; 随便起的变量 ↓ for(sss in o) { document.write(o[sss],"<br/>"); /*显示的是：nameshuxing 21 nan ，“document.write(sss)”输出的是属性的名字/*name age gender*/ “对象[属性名字]”显示的是相应属性的内容，就像hashtable中的查询一样*/ } document.write("<b>window对象属性</b><br/>"); for(aaa in document) { document.write(aaa,",<br/>"); } } //闭包 /*函数嵌套*/ { function test(num1,num2) { var num3=10; function inter(num4) { return num1+num2+num3+num4 } return inter; /*这个return不能少，否则不能显示*/ } var zhi=test(10,20); document.write(zhi(20)); /*显示：60*/ /*zhi(20)没有提示*/ var aa="hello world"; function a() { document.write(aa,"<br/>"); } a(); /*显示：hello world* 必须调用/ var num3=10; function b(num1,num2) { function bb() { return num1+num2+num3; } return bb; } var bbb=b(10,20); document.write(bbb()); /*显示：40*/ } JS高级编程第二章对象 /**/↑↓←→ //火狐浏览器能当计算器，输入“javascript:3-2”显示1，也可以写一些简单的Js语句，函数什么的 //JavaScript在什么时间被执行 { 1、在文档被装载的时候 2、文档加载后 /*在文档被加载后，<body>标记onload()时间发生，此时文档已经加载完毕*/ 3、被其他的JavaScript语句调用以下取自ajax and dot。Net2.0 脚本装载周期：当网页被浏览器加载时，javascript在以下3个时间点被执行一：在文档被装载期间注意：此时文档还没有被加载，文档中的元素不能被使用。 <html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>My HTML Page</title> </head> <body> <h1>During load script execution</h1> <script type="text/javascript" language="javascript"> alert("executing during page load."); </script> <h1>alert has executed!</h1> <form id="frmDefault" runat="server"> <div> </div> </form> </body> </html> 二：文档加载后在文档被加载后，<body> 标记 onload() 事件发生，此时文档已经加载完毕。 <html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>My HTML Page</title> </head> <script type="text/javascript" language="javascript"> function alldone() { alert("all done!"); } </script> <body onload="alldone();"> <h1>After load script execution</h1> <h1>Final line...almost done!</h1> <form id="frmDefault" runat="server"> <div> </div> </form> </body> </html> 三：被其他的javascript语句调用 } //对象的官方概念 :ECMA-262把对象定义为“属性的无序集合，每个属性存放一个原始值、对象或函数。”这意味着对象是无特定顺序的值的数组。 //JavaScript对象分类 { 1、本地对象例如：ECAM-262定义的对象：Object Functioin、Boolean、 Number 等 2、内置对象例如：Global对象、Math对象 3、宿主对象例如：所有DOM、BOM对象 } //对象的创建 { 使用new关键字创建本地对象例如：var o=new Object(); /*应用*/ var car = new Object(); car.name = "凯迪拉克"; car.money = 1111111; document.write("我新买的" + car.name + "<br/>"); 显示：我新买的凯迪拉克 document.write("这破车花了我" + car.money + "<br/>"); 显示：这破车花了我1111111 使用对象直接量创建例如：var oo={}; var ooo={x:1,y:2}; /*应用*/ var obj = { x: 1, y: 2 } /*格式： var 对象名={ 属性名：值，属性名: 值......}*/ for (mycar in obj) { /用对象直接量创建相当于创建一个函数（函数体内包含X Y（做成未赋值的属性））并用一个值初始化它并把属性赋值/ document.write(mycar + "<br/>"); } for (aaa in obj) { document.write(obj[aaa]+"<br/>"); } /*显示*/ x y 1 2 } //对象的属性的表示方法 { 1、object.property 2、object["property"] /*例子*/ var car={x:1}; car["color"]="黑色"; car["name"]="宝马"; car["price"] = 150000; var msg; for(msg in car) //调用方法显示出car中的所有属性的名称 { msg+=" "; document.write(msg); } /*显示*/ x color name price } //JavaScript本地对象 { Object 类 /*ECMAScript中的所有类都由这个类继承而来 */ { 属性 Constructor——对创建对象的函数的引用（指针）。对于Object类，该指针指向原始的object()函数(每个对象都有这个属性，它指向用来初始化该对象的构造函数) Prototype——对该对象的对象原型的引用。对于所有的类，它默认返回Object对象的一个实例。 } Number 类 /*代表数值数据类型和提供数值常数的对象*/ { 创建：numObj=new Number(value) /*一般很少这样用，这么创建是引用类型的*/ 属性 MAX_VALUE 属性|MIN_VALUE 属性|NaN 属性|NEGATIVE_INFINITY 属性|POSITIVE_INFINITY 属性|constructor 属性|prototype 属性方法 toString 方法|valueOf 方法 { /*例子*/ var num1 = mynumber.valueOf(); var num2 = mynumber.toString(); document.write(num1, "<br/>"); /*显示：100*/ valueOf()和toString()在用法和结果上没什么区别 document.write(num2,"<br/>"); /*显示：100*/ } toFixed(int值)方法 /*保留几位小数，在银行中有用*/ { /*例子*/ var mynumber = new Number(100); /*显示：100.0000*/ var num2 = mynumber.toFixed(4); /*保留四位小数*/ document.write(num2, "<br/>"); } Number.MAX_VALUE方法和Number.MIN_VALUE方法 { /*例子*/ var max = Number.MAX_VALUE; var min = Number.MIN_VALUE; document.write(max+"<br/>"); document.write(min); /*显示*/ 1.7976931348623157e+308 5e-324 } } String类 { 语法： indexOf(“查找的子字符串”，查找的起始位置) 返回子字符串所在的位置，如果没找到，返回－1 例如： var x var y=“abcdefg”; x=y.indexOf(“c” , 0 ); //返回结果为2，起始位置是0 /*例子及其他方法*/ var str = new String("hello world 字符串示例"); //Lenght属性 document.write(str.length, "③<br />");//获取字符串的长度 /*显示：17③*/ //charAt charCodeAt() document.write(str.charAt(0), "④<br />");//获取指定位上的字符 /*显示：h④*/ document.write(str.charCodeAt(0), "<br />"); //获取指定位上的字符的ascii码 /*显示：104*/ //concat() 与“+”号相同 var oStringObject = new String("hello "); var sResult = oStringObject.concat("world"); document.write(sResult, "⑤<br />"); /*显示：hello world⑤*/ document.write(oStringObject, "⑥<br />"); /*显示：hello ⑥*/ //没有改变本身的值 //indexOf() lastIndexOf() var myStr = new String("hello world"); document.write(myStr.indexOf("o"), "⑦<br />"); /*显示：4⑦*/ //下标从0开始第一个“o”在下标4的位置上 document.write(myStr.lastIndexOf("o"), "⑧<br />");//获取最后一个指定字符的位置 /*显示：7⑧*/ //下标从0开始从后数第一个“o”在下标7的位置上 //slice() substring() //字符串的截取，两者不同的是“slice()”的（）中可以放负数，“substing()”的（）中如果放入负数则被系统看成0 document.write(myStr.slice(3), "⑨<br />"); /*显示：lo world⑨*/ //第一个参数表示的从3开始截（包括3）没有第二个参数就有多长截多长 document.write(myStr.substring(3), "⑩<br />"); /*显示：lo world⑩*/ //第一个参数表示的从3开始截（包括3）没有第二个参数就有多长截多长 document.write(myStr.slice(3, 7), " 11<br />"); /*显示：lo w 11*/ //第一个参数表示的从3开始截（包括3）第二个参数表示截到下标7为止（不包括7） document.write(myStr.substring(3, 7), " 12<br />"); /*显示：lo w 12*/ //同上 document.write(myStr.slice(-3), " 13<br />");//相当于slice（8）字符串长度+参数 /*显示：rld 13*/ //可以接受负数，-3表示截取字符串中的最后3个 document.write(myStr.substring(-3), " 14<br />");//负数相当于0 /*显示：hello world 14*/ //不能接受负数，系统自动转换成0，表示从0开始截，有多长截多长 document.write(myStr.slice(3, -4), " 15<br />");//相当于slice（3，7） /*显示：lo w 15*/ document.write(myStr.substring(3, -4), " 16<br />");//相当于substring（0，3）较小的数字放在第一个参数，位置自动转化 /*显示：hel 16*/ //toLowerCase() toUpperCase() toLocaleLowerCase() toLocaleUpperCase() //转换大小写，toLocaleLowerCase() toLocaleUpperCase()是基于特定的区域实现的（一般用不上） document.write(myStr.toLowerCase(), " 17<br />"); /*显示：hello world 17*/ document.write(myStr.toLocaleLowerCase(), " 18<br />"); /*显示：hello world 18*/ document.write(myStr.toUpperCase(), " 19<br />"); /*显示：HELLO WORLD 19*/ document.write(myStr.toLocaleUpperCase(), " 20<br />"); /*显示：HELLO WORLD 20*/ //big() small() document.write(str.small()," 21<br />");//缩小字体 document.write(str.big()," 22<br />");//放大字体 //斜体字和删除线 var ss=str.italics()+str.strike(); //italics()方法是将字体显示为斜体， strike()方法是在显示的字体上加上删除线 document.write(ss); fontcolor();设定字体颜色 /*例子*/ var a = "换个字体颜色"; a = a.fontcolor("red"); document.write(a); sub();把字变成下标 document.write("H"+"2".sub()+"O"); //这是字符串的方法，如果用var b = 2; b = b.sub();则行不通。 } Math类 { <meta http-equiv="refresh" content="2" /> //2秒自动刷新 var test=Math.E;//表示自然对数的底 document.write(test,"<br />"); /*显示：2.718281828459045*/ test=Math.PI; document.write(test,"<br />"); /*显示：3.141592653589793*/ document.write("2秒自动刷新，随机显示图片"); var i = 0; //Math.random( ) ：产生0－1的随机小数,Math.random()*10产生一个0-10的随机小数 i=Math.round(Math.random()*10); //Math.round( )：四舍五入取整，如9.34 取整为9 document.write("<img width=400 height=260 src=img/"+i+".jpg>"); } Date类 { var 日期对象 = new Date (年、月、日等参数) 例： var mydate=new Date( “July 29, 1998,10:30:00 ”) 如果没有参数，表示当前日期和时间例： var today = new Date( ) 方法 { getYear(): 返回年数　getMonth():返回当月号数　getDate(): 返回当日号数　getDay():返回星期几　getHours():返回小时数　getMintes():返回分钟数　getSeconds():返回秒数　getTime() : 返回毫秒数 setYear():设置年　setDate():设置当月号数　setMonth():设置当月份数　setHours():设置小时数　setMintes():设置分钟数　setSeconds():设置秒数　setTime ():设置毫秒数 } /*例子*/ //第一种参数 var someDate=new Date(2008,05,20,12,00,00); document.write(someDate,"<br />"); //第二种参数 someDate=new Date("july 20 2008 12:30:30"); document.write(someDate,"<br />"); //获取系统当前日期 var today=new Date(); document.write(today,"<br />"); document.write("某特定时间的星期为"+today.getDay()+"<br />");//0代表星期日 document.write("某特定时间的日子为"+today.getDate()+"<br />"); document.write("某特定时间的月份为"+(today.getMonth()+1)+"<br />");//月从0月开始 0代表十二月，0~11 document.write("某特定时间的年份为"+today.getFullYear()+"<br />"); document.write("某特定时间的小时为"+today.getHours()+"<br />"); document.write("某特定时间的分钟为"+today.getMinutes()+"<br />"); document.write("某特定时间的秒为"+today.getSeconds()+"<br />"); //通过setDate方法修改日期，其他类似 today.setDate(25); document.write("修改后的日期为"+today.getDate()+"<br />"); /*显示*/ Fri Jun 20 12:00:00 UTC+0800 2008 Sun Jul 20 12:30:30 UTC+0800 2008 Wed Aug 30 17:43:14 UTC+0800 2006 某特定时间的星期为3 某特定时间的日子为30 某特定时间的月份为8 某特定时间的年份为2006 某特定时间的小时为17 某特定时间的分钟为43 某特定时间的秒为14 修改后的日期为25 /*实际用法*/ var now = new Date(); var hour = now.getHours(); if (hour >= 0 && hour <= 12) document.write("上午好!") if (hour > 12 && hour <= 18) document.write("下午好!"); if (hour > 18 && hour < 24) document.write("晚上好!"); document.write("<P>今天日期:" + now.getYear() + "年" + (now.getMonth() + 1) + "月" + now.getDate() + "日"); //月份数字0－11，注意＋1 document.write("<P>现在时间:" + now.getHours() + "点" + now.getMinutes() + "分" + now.getSeconds() + "秒"); /*显示*/ 下午好! 今天日期:2006年8月30日现在时间:17点58分22秒 //setTimeout() /*一次性定时器*/ 的用法 { setTimeout（“调用的函数”,”定时的时间”）例： var myTime＝setTimeout（”disptime( )”,1000）; /*定时的时间是以毫秒为单位*/ //设定定时器 clearTimeout（myTime）; //解除定时器 } setInterval() /*循环性计时器*/ 用法同上 } } /**/↑↓←→ //数组 { 声明数组三种方式第一种 var 数组名 = new Array(); /*赋值时用：数组名[数字]=值*/ /*数组的下标必须是大于0的数字否则就会被当成数组的一个属性对待*/ 例： var emp = new Array() 第二种 var 数组名=new Array(5,4,3,2,1,”test”); /*数组中能放任何类型的元素*/ 第三种 var misc = [ 1.1, true, "a", ]; var b = [[1,{x:1, y:2}], [2, {x:3, y:4}]]; /*理解*/ function Circle(x,y,z) { this.x=x; this.y=y; this.z=z; } var c=new Circle(1,2,3); c[0]="this is an element"; c[1]="this is an element"; c[2]="this is an element"; for(var temp in c) { document.write(c[temp],"<br />"); /*如果（c,"<br/>"）显示的是 x,y,z,0,1,2*/ //显示：1,2,3,this is an element,this is an element,this is an element } /*c[0]说是数组实际上也可以理解成属性，在Js中这两者的分界线并不是十分明显*/ var test=new Array(1,2,3,4,5); for(var i=0;i<test.length;i++) { document.write(test[i],"<br />"); } document.write("改变length的值前数组的长度：" + test.length, "<br />"); test.length=3; /*数组的长度可以自己指定，指定的长度要是比原来的小：就自动把长出的部分自动砍掉，要是指定的长度比原来的长度长，多出的部分就是undefined(未定义)*/ document.write(test, "<br />"); /*自动将元素用“，”连接*/ document.write("改变length的值后数组的长度：" + test.length, "<br />"); delete test[0]; /*用delete将数组的元素值删除，删除后的元素位置还在，只是没有值*/ document.write(test, "<br />"); document.write("使用delete后数组的长度：" + test.length); /*显示*/ 1 2 3 4 5 改变length的值前数组的长度：5 1,2,3 改变length的值后数组的长度：3 ,2,3 使用delete后数组的长度：3 JavaScript并不支持真正的多维数组，但是它允许使用元素为数组 /*例子*/ var table=new Array(3);//3行 for(var i=0;i<table.length;i++) { table[i]=new Array(3);//每行3列 } for(var row=0;row<table.length;row++) { for(var col=0;col<table[row].length;col++) /*数组之间的嵌套，赋值时：数组名[int][int]*/ { table[row][col]=row*col; } } for(var r=0;r<table.length;r++) { for(var c=0;c<table[r].length;c++) { document.write(table[r][c]+" "); } document.write("<br />"); } /*显示*/ 0 0 0 0 1 2 0 2 4 //数组的方法 { join()方法：该方法可以把一个数组的所有元素有转换成字符串，然后再把他们连接起来 /*例子*/ var test=[1,2,3]; var s = test.join("-"); document.write(test, "<br />"); document.write(s, "<br />"); /*显示*/ 1,2,3 1-2-3 reverse()方法 : 该方法将颠倒数组元素的顺序并返回颠倒后的数组 /*例子*/ var test=[1,2,3,4,5,6]; test.reverse(); for (var i = 0; i < test.length; i++) /*颠倒数组对原数组也进行了变动*/ { document.write(test[i], "<br />"); } /*显示*/ 6 5 4 3 2 1 sort()方法：该方法在原数组上对数组元素进行排序 /*例子*/ var fruits=["manago","orange","apple","strawberry"];//在元数组上进行排序 var myFruits=fruits.sort(); for(var i=0;i<myFruits.length;i++) { document.write(myFruits[i],"<br />"); /*排序对原数组也进行了改动，在对英文进行排序时，会比对第一个英文字母按照二十六个英文字母进行排序*/ } for (var i = 0; i < fruits.length; i++) { document.write(fruits[i], "<br />"); } var test=[33,4,611,222]; test.sort(); /*直接用数组名.sort()对数字数组进行排序时，并不是按照数字的大小进行排序，而是和英文排序一样，将数字的第一位拿出，按照大小进行排序*/ for(var i=0;i<test.length;i++) { ocument.write(test[i],"<br />"); } test.sort(function(a,b){return a-b;}); /*想对数字数组按照数字的大小进行排序时 test.sort(function(a,b){return a-b;}); 记住就这么用，方法中如果第一个参数应该出现在第二个参数之前那么比较函数就会返回一个小于0的数，如果第一个参数应该出现在第二个参数之后，那么比较函数就会返回一个大于0的数*/ for(var i=0;i<test.length;i++) /*如果对一组字符串数组进行不分大小写的字母排序操作使用tolowerCase()*/ { document.write(test[i],"<br />"); } /*显示*/ apple manago orange strawberry apple manago orange strawberry 222 33 4 611 4 33 222 611 concat()方法：该方法能创建并返回一个数组 /*例子*/ var test=[1,2,3]; document.write(test,"<br />"); result = test.concat([8, 9]); /*添加时自动将[]去掉,只能去掉一层[],[5,[6,7]]添加后为5，[6,7]*/ for(var i=0;i<result.length;i++) { document.write(result[i],"<br />"); /*使用此方法只是能在原有的数组基础上在创建一个数组，所以必须用一个变量接受，此方法对原数组没有影响*/ } /*显示*/ 1,2,3 1 2 3 8 9 slice()方法：返回的是指定数组的子数组 /*例子*/ var test=[1,2,3,4,5,6]; var result=test.slice(0,3); /*slice(0,3) ： 0 ：从索引0开始截， 3 ：截到索引3为止（包括0不包括3），如果没有第二个参数就将剩下的全部删除*/ for(var i=0;i<result.length;i++) { document.write(result[i],"<br />"); } /*显示*/ 1 2 3 splice()方法：该方法可以把元素从数组中删除，也可以将新元素插入到数组中，它在原数组上修改数组，并不创建新数组 !只在firefox中能正确浏览! 注意：和concat()不同，splice()并不将它插入的数组参数展开，也就是说，如果传入的是一个数组插入的就是一个数组而不是这个数组的元素 /*例子*/ //IE浏览器无效，使用FireFox var test=[1,2,3,4,5,6,7,8]; //删除元素 var result = test.splice(4); //没有指定第二个参数表示从起始位置删至结尾，删除了5，6，7，8，将删除的数组返回 for(var i=0;i<result.length;i++) { document.write(result[i],"<br />"); } document.write("---------------------------<br />"); for(var i=0;i<test.length;i++) { document.write(test[i],"<br />"); } //添加元素 document.write("---------------------------<br />"); var test1=[1,2,3,4,5,6,7,8]; //第二个参数表示要删除的元素数，0表示不删除，直接插入，非0表示删掉之后再插入 var addResult=test1.splice(2,4,"liwei","marssion"); for(var i=0;i<addResult.length;i++) { document.write(addResult[i],"<br />"); } document.write("---------------------------<br />"); for(var i=0;i<test1.length;i++) { document.write(test1[i],"<br />"); } /*显示*/ 5 6 7 8 --------------------------- 1 2 3 4 --------------------------- 3 4 5 6 --------------------------- 1 2 liwei marssion 7 8 push()方法和pop()方法 //方法可以将一个或多个新元素附加到数组的尾部，然后返回数组的新长度，方法pop()将删除数组的最后的一个元素，减少数组的长度，返回它删除的值。 //注意：这两个方法都是在原数组上修改数组，而非生成一个修改过的数组副本，联合使用push()和pop()，就可以用javascript实现一个先进后出的栈； /*例子*/ var temp=[]; document.write("Push<br />"); temp.push(1, 2, 3, 4); document.write("数组元素有："+temp+"<br />数组长度是："+temp.length); document.write("<br />"); document.write("Pop<br />"); temp.pop(); document.write("数组元素有："+temp+"<br />数组长度是："+temp.length); /*显示*/ Push 数组元素有：1,2,3,4 数组长度是：4 Pop 数组元素有：1,2,3 数组长度是：3 unshift()方法和shift()方法 //方法unshift()会将一个或多个元素添加到数组的头部，然后把已有的元素移动到下标较大的位置以腾出空间，它返回的是数组的新长度； //方法shift()会删除并返回数组的第一个元素，然后将后面的所有元素都向前移动以填补第一个元素留下的空白 /*例子*/ //先进先出（FIFO） var test=[]; document.write("Unshift<br />"); test.unshift(1, 2, 3, 4); document.write(test,"<br />"); document.write("Shift<br />"); test.shift(); document.write(test,"<br />"); /*显示*/ Unshift 1,2,3,4 Shift 2,3,4 instanceof运算符与typeof运算符相似，用于识别正在处理的对象的类型，不同的是，instanceof方法要求开发者明确地确定对象为某特定类型例：var ostring=new String(“hello”) document.write(ostring instanceof String); //返回一个boolean值，类型正确返回true否则返回false } } //对象的共同属性和方法 { toString() //object类的方法，将非字符串转换成字符串 toLocaleString() //object类的方法，返回对象本地化字符串，object默认的方法自身不做任何局部化，返回结果与toString()相同 hasOwnProperty(property) //object类的方法，判断对象是否有某个非继承属性 propertyIsEnumerable(property) //object类的方法，属性（非继承）是否可用 For in枚举 isPropertyOf(object) //object类的方法，判断该对象是否为传入对象的原型 } JS高级编程第三章： Function 函数、类、构造函数、原型 Classes,Constructors,and Prototypes /**/↑↓←→ //JS的断点：在需要打断点的地方写上debugger ，在遇到版本不能调试时很可能是调试被禁用了：打开IE 工具→Internet选项→高级→浏览（将禁用脚本点没） //上节课补充 { <SCRIPT language="JavaScript“> var a="3" , b="4"; alert (a+"+"+b ); //输出的是： 3+4 alert (eval(a+"+"+b) ); //输出的是： 7 eval("字符串"); eval()会将（）中的代码进行动态解析，把代码解析成js脚本，不过尽量少用，因为怕有恶意脚本入注 </SCRIPT> } //函数的定义（3种方法） { 定义函数： function 函数名( 参数1,参数2，… ) { 语句; } 如果函数不包含return语句，返回undefined var f = new Function("x", "y", "return x*y;"); //一般不用，效率太低等同于： function f(x, y) { return x*y; } var f=function(x){return x*x} 函数直接量是一个表达式，他可以定义匿名函数/*匿名函数：函数在定义的时候没有名字，而用一个变量接受*/ } //函数的调用 { 调用函数：使用运算符（）来调用它 ; 调用函数的注意事项（1）不能给函数的参数指定一个函数类型（2）JavaScript不会检测传递的数据是不是那个函数所要求的类型（3）也不会检测传递给他的参数个数是否正确 } //函数的递归 { var a = function aa(b) { //aa是方便后面调用 if (b <= 1) { return 1; } return b * aa(b - 1); } document.write(a/*或aa*/(5)); //相当于：5*4*3*2*1 显示120 } //函数并不只是一种语法，还可以是数据 { var aa = new Array(3); aa[0] = function(x) { return x * x; } aa[1] = 20; aa[2] = aa[0](aa[1]); document.write(aa[2]); //显示：400 } //做为方法的函数 { var calculator={ num1:1, !注意是“，”! num2:1, compute:function(){this.result=this.num1+this.num2;} //calculator相当于一个类 this.result相当于函数自定义了一个属性 }; //debugger calculator.compute(); document.write(calculator.result,"<br />"); //显示：2 //calculator.result可能点不出来 //this : 指向正在被调用的对象 function aa() { return this.num11 * this.num22; } function bb(num1, num2) { this.num11 = num1; this.num22 = num2; this.a = aa; } var b = new bb(2, 3); //要用一个变量接受一下，这个事例是模仿的类，所以就要像真正的类一样用变量new一下然后才能点出 document.write(b.a()); //显示：6 } //Arguments { 它是调用对象的一个特殊属性，能够计算出传入方法时实际参数的个数，它不是数组但可以用数组的方式操作它通过Arguments[]数组改变参数的值同样会改变用参数名获取的参数值 /*例子*/ function test(x,y,z) { try { if (arguments.length != 3) { throw new Error("未提供正确的参数个数"); //JS中的throw } else if (typeof (arguments[0]) != "number" || typeof (arguments[1]) != "number" || typeof (arguments[2]) != "number") { throw new Error("参数类型错误"); } else { return x + y + z; } } catch(exception) //exception没有提示，硬打 { document.write(exception.message); //exception.message也没有提示 return ""; //不加return"";返回undefined } } document.write(test(1,2,"3"),"<br />"); document.write(test(1)); document.write(test(1,3,5)); document.write("<br />"); function fun(x) { document.write(x+"<br />"); arguments[0]=null;//arguments[0] 命名参数x是引用同一变量的两种不同方法 document.write(x); } fun(12); /*显示*/ 12 null } //callee /*指向当前正在被执行的函数*/ { function aa(x) { if(x<=1) { return 1; } return x + arguments.callee(x-1); /arguments.callee()指向的就是函数aa()/ } document.write(aa(6)); /显示：21（6+5+4+3+2+1）/ function aa(a, s, d) { document.write(arguments.length+"<br/>"); //显示： 1 //argument.length :实际参数的个数 document.write(arguments.callee.length + "<br/>"); //显示： 3 //arguments.callee.length :形式参数的个数 document.write(aa.length); //显示： 3 //函数名.length :形式参数的个数 } aa(1) } //函数的方法 { call() 方法 f.call(o, 1, 2); //将f绑定到o "1,2"是f执行时需要的参数这与下面的代码相似： o.m = f; o.m(1,2); delete o.m; //call apply { function Add(x,y) { return x+y; } var o = new Object(); document.write(Add.call(o,1,2),"<br />"); //绑定后直接返回值 //类似于 //o.m=Add; //o.m(1,2); //delete o.m; document.write(Add.apply(o,[1,2])); //给的是个数组，在但是在绑定时自动拆开本事例的结果两者相同 } } //模拟命名空间 { if(typeof com=="undefined") //注意：undefined是字符串类型的要用“” { com=new Object(); //com前没有var } if(typeof com.sitepoint=="undefined") //个人觉得没什么用，可以用自己起的特别点的名字加_代替 { com.sitepoint=new Object(); } com.sitepoint.Bird=function() { this.feet=2; this.feathers=true; } var tweety=new com.sitepoint.Bird(); alert("鸟有"+tweety.feet+"爪子"); } //用new关键字创建对象 { function Aa(w,h) //此示例模拟了一个类，this点出的方法做为本类的方法注意：为了区分类和方法在命名时类的首字母要大写 { this.width=w; //width作为本类的属性 this.heigh=h; this.shuxing=function () { return this.width*this.heigh; } } var a=new Aa(12,12); //没次new 都创建了一个新的对象，也重复创建了"shuxing"方法，浪费内存 var b=new Aa(2,2); var c=new Aa(3,3); var cc=a.shuxing(); document.write(cc); } //使用原型创建对象（调用prototype方法） //prototype：原型 { function P(x, y) { this.x = x; this.y = y; this.total = function() { return this.x+this.y; }; } P.prototype.z = 10; //添加对象P的原型属性 //用原型创建对象：原型对象或方法不在类中声明，在类的下面用：类名.prototype.属性名（或方法名）=值，声明后的属性和方法在调用时和普通属性方法没什么不同，只是在创建对象时不重复创建 P.prototype.total1 = function(x, y) { //添加对象P的原型方法 return x+y+1; }; var t = new P(1, 2); var t1 = new P(3,4); t.z = 20; //动态添加属性，在java这种强类型语言中是不可能的…… document.write(" total:"+t.total()+" total1:"+t.total1(1,3)+" z:"+t.z+"</br>"); document.write(" total:"+t1.total()+" total1:"+t1.total1(2,4)+" z:"+t1.z+"</br>"); /显示/ total:3 total1:5 z:20 total:7 total1:7 z:10 } //模拟类的继承（call继承） { function jilei(q,w) { this.qq=q; this.ww=w; this.ii=function () { return this.qq*this.ww; } } jilei.prototype.ee=function() { return this.qq+this.ww; } function zilei(r,t) { jilei.call(this,2,3); //绑定时用this代表本类 this.rr=r; this.tt=t; } zilei.prototype.yy=function() { document.write(this.rr*this.tt); return""; //指定返回值为空否则返回undefined } var jj=new zilei(4,5); document.write(jj.ii()); //调用基类的方法不能点出只能硬打 document.write(jj.yy()); /显示/ 6 20 } /例子/ 『 function xing(bian) { this.bianshuxing=bian; // this.jibianxing=function () // { // document.write("这是一个"+this.bianshuxing+"形"); // } } xing.prototype.jibianxing=function() { document.write("这是一个"+this.bianshuxing+"形"); } function san(di,gao) { xing.call(this,3); this.d=di; this.g=gao; } san.prototype=new xing(); //在继承类的下面加上，让子类能够继承基类的所有属性包括原型方法 san.prototype.s=function() { document.write("三角形的底是:"+this.d+"三角形的高是:" +this.g+"面积是："+this.d*this.g/2); } function si(bian,bian3) { xing.call(this,4); this.bian1=bian; this.bian2=bian3; } si.prototype=new xing(); si.prototype.ss=function() { document.write("四边形的一条边为："+this.bian1+"四边形的第二条边为："+this.bian2+"面积是："+this.bian1*this.bian2); } debugger; var sanj=new san(4,3); sanj.jibianxing(); sanj.s(); var sibian=new si(7,8); sibian.jibianxing(); sibian.ss(); 』 //例子// { function xing(bian) { this.bianshuxing=bian; this.jibianxing=function () { document.write("这是一个"+this.bianshuxing+"形"); } } function san(di,gao) { xing.call(this,3); this.d=di; this.g=gao; } san.prototype.s=function() { document.write("三角形的底是:"+this.d+"三角形的高是:" +this.g+"面积是："+this.d*this.g/2); } function si(bian,bian3) { xing.call(this,4); //this : 指示的是正在运行的程序，在类中是new出的类名指向的东东 this.bian1=bian; this.bian2=bian3; } si.prototype.ss=function() { document.write("四边形的一条边为："+this.bian1+"四边形的第二条边为："+this.bian2+"面积是："+this.bian1*this.bian2); } debugger; var sanj=new san(4,3); sanj.jibianxing(); sanj.s(); var sibian=new si(7,8); sibian.jibianxing(); sibian.ss(); /显示/ { `这是一个3形三角形的底是:4三角形的高是:3面积是：6这是一个4形四边形的一条边为：7四边形的第二条边为：8面积是：56 } } //不管用不用prototype方法创建，系统都会自动创建一个原型，里面有一个constructor对象，里面放的是一个指针，这个指针不随着类new出的对象里的元素的变化而变化，它能指向自己的基类『 /例子/ <script language="javascript" type="text/javascript"> function Student(sName) { this.name=sName; this.displayName=function (){ alert(this.name); } } function ZhangSan(sName,sAge) { this.method=Student; this.method(sName); delete this.method; //将delete this.method注释了也能正常运行， zhangsan new 出的对象虽然把method删除了，但是在new出的对象里面随着类的实例化的同时系统自动创建了一个原型，里面有一个指向基类（student类）的指针，所以在调用基类的方法时虽然她的method已经删除还是能找到基类的方法 this.age=sAge; this.displayAge=function (){ alert(this.age); } } var s1=new Student("普通学生"); s1.displayName(); var zs=new ZhangSan("张三",23); zs.displayName(); zs.displayAge(); </script>

1
2
3
下一页
阅读全文

有用 | 无用

魔鬼字典 JavaScript 笔记代码比较多乱

猜你喜欢

您可能感兴趣的文章:

魔鬼字典 JavaScript 笔记 代码比较多乱

猜你喜欢

您可能感兴趣的文章:

魔鬼字典 JavaScript 笔记代码比较多乱