Javascript学习总结-面向对象-(五)
来源:互联网 发布:mac ps 菜单栏不见了 编辑:程序博客网 时间:2024/04/26 03:32
JavaScript面向对象的脚本语言,此时开发者在开发的时候需要找对象,默认提供了内置的对象。也可以根据开发者的需求自己定义对象。
1.1. 基本数据类型包装类
为了便于操作基本类型值,ECMAScript 提供了3个特殊的引用类型:Boolean,Number,String。它们是引用类型。当读取基本数据类型时,后台就会创建一个对应的基本包装类对象,所以我们在操作基本数据类型时,可以直接调用一些方法。
1.1.1. String
//通过构造函数创建String 对象var b = new String("java");var c = new String("java");document.write(b + "," + c);document.write(b == c);//false//比较字符串的值是否相等document.write(b.valueOf() == c.valueOf());
//属性var a = "helloworld";document.write(a.length);
常见的方法:
Anchor() 生产锚点
Blink() 为元素添加blink标签
charAt() 返回指定索引位置处的字符。
charCodeAt() 回一个整数,代表指定位置上字符的 Unicode 编码。
Concat() 回字符串值,该值包含了两个或更多个提供的字符串的连接。
Fontcolor() 把带有 COLOR 属性的一个 HTML <FONT> 标记放置在 String 对象中的文本两端
indexOf() 返回 String 对象内第一次出现子字符串的字符位置
italics() 把 HTML <I> 标记放置在 String 对象中的文本两端。
Link() 把一个有 HREF 属性的 HTML 锚点放置在 String 对象中的文本两端。
Replace() 返回根据正则表达式进行文字替换后的字符串的复制
Split() 切割
Substr() 截取子串
toUpperCase() 转大写
toLowerCase() 转小写
//方法document.write("第五章".anchor("ch1"));document.write("第五章".blink());// 返回在指定位置的字符。document.write("第五章".charAt(0));document.write("a".charCodeAt(0));document.write("第五章".concat("abc"));document.write("第五章".fontcolor("#ff0000"));document.write("第五章".indexOf("五"));document.write("第五章".italics());document.write("第五章".link());document.write("helloworld".replace(/l/g, "L"));document.write("<br/>");var names = "jack-lili-lucy".split("-");for (var temp in names) { document.write(names[temp] + "<br/>");}document.write("<br/>");document.write("helloworld".substr(1, 2)); //eldocument.write("helloworld".substring(1, 2));//edocument.write("helloworld".toUpperCase());document.write(new String("java").toString() == new String("java").toString());
1.1.2. Number
构造函数
//创建number对象var a = 12;var b = new Number(12);document.write(a + ":" + b);//比较数值truedocument.write(a == b);//没有转型falsedocument.write(a === b);//falsedocument.write(new Number(12) == new Number(12));//falsedocument.write(new Number(12) === new Number(12));// falsedocument.write(new Number(12).valueOf() == new Number(12).valueOf());//truedocument.write(new Number(12).valueOf() === new Number(12).valueOf());
属性:
document.write("最大值" + Number.MAX_VALUE + "</br>");document.write("最小值" + Number.MIN_VALUE + "</br>");
方法
//方法document.write(new Number(12).toString(10) + "<br/>");document.write(new Number(12).toString(2) + "<br/>");document.write(new Number(12).toString(8) + "<br/>");document.write(new Number(12).toString(16) + "<br/>");document.write(new Number(12.12345) + "<br/>");document.write(new Number(12.12345).toFixed() + "<br/>");document.write(new Number(12.12345).toFixed(2) + "<br/>");document.write(new Number(12.12345).toFixed(3) + "<br/>");
备注:toFixed()是指定小数位数。
1.2. Math类
Math工具类中的方法
max()
min()
random()
...更多请看文档
document.write(Math.ceil(12.34) + "<br/>");//13document.write(Math.floor(12.34) + "<br/>");//12document.write(Math.round(12.54) + "<br/>");//13document.write(Math.round(12.35) + "<br/>");//12document.write(Math.random() + "<br/>");//0~1document.write(Math.max(12, 100, -1, 200, 320, 500) + "</br>");document.write(Math.min(12, 100, -1, 200, 320, 500) + "</br>");
1.3. Date对象
setInterval(代码, 毫秒数) 每经过指定毫秒值后执行指定的代码。
setTimeout(代码, 毫秒数) 经过指定毫秒值后执行指定的代码(只执行一次)。
查看文档学习Date的其他方法
function showDate() { //获取系统时间 var date = new Date(); //获取年 月 日时分秒 var str = date.getFullYear() + "年" + (date.getMonth() + 1) + "月" + date.getDate() + "日" + "星期" + date.getDay() + " " + date.getHours() + "时" + date.getMinutes() + "分" + date.getMinutes() + "分" + date.getSeconds() + "秒" //将格式化好的时间显示在叶面的span标签体中 var span = document.getElementById("mydate"); //给span标签设置标签体内容 span.innerHTML = str.fontcolor("red"); //调用定时函数 window.setTimeout("showDate()", 1000);}//调用函数showDate();
1.4. 数组
数组定义:
创建数组的基本方式有2种.
第一种是使用Array的构造函数
不指定长度
var arrs=new Array();
如果确定知道数组保存的数量,可以通过构造函数传递数组的长度
指定长度
var arrs=new Array(20);
该数组有20个元素,每一项的默认值都是undefined
指定元素
var arrs=new Array("hello"); 会创建一个元素的数组.
第二种方式
指定元素
创建一个包含3个字符串的数组
var arrs=["aa","bb","cc"];
创建一个空数组
var arrs=[]; var values=[1,2];
数组初始化
var arrs=["aa","bb","cc"]; color[2]="xx";//修改第3项 color[3]="zz";//新增第4项
数组遍历:
for(var i = 0; i < arr.length; i++){ alert(arr[i]); }
或
for( var i in arr ){ // i 是遍历出的数组中的索引,从0开始,一直到最大索引。 // 如果有其他属性,也会遍历出来,其实索引就是数组对象的属性。 alert(arr[i]); }
注意:
JS数组可以动态增长:
//数组的声明和初始化,注意:数组的长度取决于整数下标的个数var arr = new Array();arr[0] = "aa";2arr[1] = "bb";arr[6] = 'xx';document.write(arr + "<br/>");//遍历数组for (var i = 0; i < arr.length; i++) { document.write(arr[i]+"<br/>");}//下标越界时:var arr = ["aa", "bb"];document.write(arr[200]);// 显示undefined
常见方法
Array中的方法:
sort()
对当前数组进行排序,并返回已经进行了排序的此Array对象。
不会创建新对象,是在指定数组中直接进行排序。
reverse()
对当前数组进行反转排序,返回一个元素顺序被反转的 Array 对象。
不会创建新对象,是在指定数组中直接进行排序。
push( [item1 [item2 [. . . [itemN ]]]] )
将以新元素出现的顺序添加这些元素。
如果参数之一为数组,那么该数组将作为单个元素添加到数组中。
pop()
移除数组中的最后一个元素并返回该元素。
如果该数组为空,那么将返回 undefined。
shift()
移除数组中的第一个元素并返回该元素。
如果该数组为空,那么将返回 undefined。
unshift([item1[, item2 [, . . . [, itemN]]]])
将指定的元素插入数组开始位置并返回该数组。
splice(start, deleteCount, [item1[, item2[, . . . [,itemN]]]])
移除从 start 位置开始的指定个数的元素,并插入新元素,从而修改 concat([item1[, item2[, . . . [, itemN]]]])
返回一个新数组,这个新数组是由两个或更多数组组合而成的。原数组不变。
要加的项目(item1 … itemN)会按照从左到右的顺序添加到数组。
如果某一项为数组,那么添加其内容到 array1 的末尾。
如果该项目不是数组,就将其作为单个的数组元素添加到数组的末尾。
slice(start, [end])
返回一个包含了指定的部分元素的数组。
将返回索引大于等于start且小于end的一段。
原数组不变。
join(separator)
把所有元素由指定的分隔符分隔开来组成一个字符串,返回这个字符串值。
如果数组中有元素没有定义或者为 null,将其作为空字符串处理。
var a = [1, 2, 3];// 连接两个或更多的数组,并返回结果。document.write(a.concat([100, 30]) + "<br/>");document.write(a.concat([100, 30], [60, 90]) + "<br/>");// 把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。var b = a.join("$");document.write(b + "<br/>");document.write( typeof b + "<br/>");//string// 删除并返回数组的最后一个元素document.write(a.pop() + "<br/>");// 向数组的末尾添加一个或更多元素,并返回新的长度。document.write(a.push(99, 78) + "<br/>");// 把数组转换为字符串,并返回结果。document.write(a.toString() + "<br/>");// 返回数组对象的原始值var c = a.valueOf();document.write( typeof c + "<br/>");
排序:
var a = [100, 9, 20, 3, 7, 96];document.write(a + "<br/>");//如果调用该方法时没有使用参数,将按字母顺序对数组中的元素进行排序a.sort();document.write(a + "<br/>");//指定比较方式a.sort(compareTo);document.write(a + "<br/>");function compareTo(a, b) { return a - b;}
1.5. 自定义对象
1.5.1. 无参构造函数
/* * 自定义对象 * * */function Person() { window.document.write("constructor()<br>");} var person = new Person();//定义属性person.name = "jack";person.age = 23;//定义方法person.work = function() { window.document.write("person working...<br/>");};//获取构造函数window.document.write(person.constructor + "<br/>"); window.document.write(person.name + "," + person.age + "<br/>");person.work();
1.5.2. 有参数构造函数
function Person(name, age) { this.name = name; this.age = age; this.work = function() { alert(this.name + ":" + this.age); }} var person = new Person("jack", 28);person.work();
1.5.3. Object方式
/* * 自定义对象Object方式 * * */var person = new Object();person.name = "jack";person.age = 28;person.sayHello = function() { document.write(this.name + ":" + this.age);}person.sayHello();
该例子创建了一个名为person的对象,并添加了2个属性(name age)和一个方法(sayHello)
使用构造函数模式方式创建对象:
先自定义类,其实就是定义一个和类名相同的函数。
再使用new关键字调用定义好的类。
(任何函数,只要通过new操作符来调用,那它就可以作为构造函数)
说明:
要将属性与方法赋给this,这样才是表示是对象的属性,如果写var str则是方法中的局部变量。
不要写new Object()。
不要写return语句。
JS在new Person()会做如下事:
1,创建一个新对象。
2,this指向新对象。
3,执行构造方法中的代码。
4,返回新对象。
字面量方式创建对象:
var person={ name:"李四", age:88, eat:function(){ alert("eating..."); }};alert(person.name+person.age);person.eat();
1.6.prototype
“prototype”字面翻译是“原型”,是javascript实现继承的主要手段。粗略来说就是:prototype是javascript中的函数(function)的一个保留属性,并且它的值是一个对象(我们可以称这个对象为"prototype对象")。
Prototype注意的细节:
- prototype是函数(function)的一个必备属性(书面一点的说法是"保留属性")(只要是function,就一定有一个prototype属性)
- prototype的值是一个对象
- 可以任意修改函数的prototype属性的值。
- 一个对象会自动拥有这个对象的构造函数的prototype的成员属性和方法。
需求:
自定义一个数组的工具类。
function arrTool(){}var ArrayTool = new arrTool();ArrayTool.getMax = function(arr){ var max = 0; for(var x=1; x<arr.length; x++) { if(arr[x]>arr[max]) max = x; } return arr[max];};ArrayTool.getMin = function(arr){ var min = arr[0]; for(var x=1; x<arr.length; x++) { if(arr[x]<min) min = arr[x]; } return min;}/*ArrayTool.getMax = getMax;//获取最值。function getMax(arr){ var max = 0; for(var x=1; x<arr.length; x++) { if(arr[x]>arr[max]) max = x; } return arr[max];}*/ArrayTool.binarySearch = function(arr,key){ var min,max,mid; min = 0; max = arr.length-1; while(min<=max) { mid = (min+max)>>1; if(key>arr[mid]) min = mid + 1; else if(key<arr[mid]) max = mid - 1; else return mid; } return -1;}/*ArrayTool.binarySearch = halfSearch;//折半查找,必须是对有序的数组。function halfSearch(arr,key){ var min,max,mid; min = 0; max = arr.length-1; while(min<=max) { mid = (min+max)>>1; if(key>arr[mid]) min = mid + 1; else if(key<arr[mid]) max = mid - 1; else return mid; } return -1;}
把数组的工具方法添加到javascript内置对象Array中。
Array.prototype.getIndex = function(element){ for(var x=0; x<this.length; x++) { if(this[x]==element) return x; } return -1;}Array.prototype.getMin = function(){ var min = this[0]; for(var x=1; x<this.length;x++) { if(this[x]<min) min = this[x]; } return min;}
给字符串添加新的方法
// JavaScript Document//给字符串string对象添加新功能。//去除字符串两端的空格。String.prototype.trim = function(){ var start,end; start = 0; end = this.length-1; while(start<=end && this.charAt(start)==" ") start++; while(start<=end && this.charAt(end)==' ') end--; return this.substring(start,end+1);} //将字符串变成数组。String.prototype.toCharArray = function(){ var arr = new Array(this.length); for(var x=0; x<this.length; x++) { arr[x] = this.charAt(x); } return arr;}//将字符串进行反转。String.prototype.reverseString = function(){ var arr = this.toCharArray(); return arr.reverse().join("");}
- Javascript学习总结-面向对象-(五)
- javascript面向对象(五)
- JavaScript学习总结_六.面向对象
- javascript面向对象编程学习总结1
- JavaScript学习总结【8】面向对象编程
- JavaScript面向对象学习总结(1.0)
- javascript 面向对象总结
- javaScript 面向对象-继承(五)
- javascript面向对象学习笔记(五)——模块化
- JavaScript学习总结——Javascript面向(基于)对象编程
- javascript面向对象学习
- javascript面向对象学习
- JAVA学习五:面向对象
- 面向对象学习总结
- 面向对象学习总结
- javascript学习总结五
- JavaScript学习总结三:js基于原型面向对象
- javascript面向对象编程总结
- Javascript学习总结-基本语法-(一)
- 继承与初始化
- Javascript学习总结-基本语法-(二)
- Javascript学习总结-基本语法-(三)
- Javascript学习总结-函数-(四)
- Javascript学习总结-面向对象-(五)
- Javascript学习总结-BOM编程-(六)
- iOS开发直播app(播放篇)
- Javascript学习总结-DOM编程-(七)
- 代码片段
- AJAX(一)-实现服务端客户端异步通信
- AJAX(二)-实现验证码异步验证功能
- JSON学习笔记
- hive安装-构建在hadoop上的数据仓库