前言
快到双十一了,又到了一年一度的触景生情的时候了.对象,作为本屌丝的我只能在是JavaScript或者是OC创建一个对象了😭....不过希望所有程序猿(媛)能在双十一成功脱单,往爱情的道路上前进一步.在这个特殊的日子将要来临的时候,我们说说关于JavaScript对象相关的内容.
JavaScript对象介绍
下面叙述的所有演示代码均在<script>标签中进行.
与OC类似,正所谓万物皆对象,JavaScript所有事物都是对象.JavaScript对象是包含着属性和方法.JavaScript对象类似于OC中的字典类型,这是前面文章中说过的.如下所示,这是JavaScript创建对象的一种形式.
下面我们就创建一个person对象.然后给它添加姓名、年龄属性.
var people = {name:'SaoDong',age:18};
然后,我们给person对象添加一个方法.
car.action = function() {
alert("你好!");
};
当然了,我们不但可以在对象初始化的时候给对象添加属性,我们也可以在初始化完成之后给对象添加属性.
var people = {name:'SaoDong',age:18};
people.car = "daHuangFeng";
那么我们该如何访问对象的属性已经方法呢?我们需要用点语法(语法糖)来访问对象的属性以及方法.如下所示.
people.car//访问对象的属性
people.action();//访问对象的方法
JavaScript内建对象类型
上面我们介绍了基本对象类型,下面就对几种常用的JS内建对象类型做一下介绍以及说明.更多是介绍它自身所带有的方法.
字符串
对于字符串的创建,我们在上一篇文章中已经说过了,下面我就对字符串对象的一些常见方法做一下列举.包括字体型号,字体颜色,超链接等. 当然,我只是介绍几种常用的属性....
fontsize()//字体型号
fontcolor()//字体颜色
link()//超链接
strike()//中划线
示例如下所示.
<body>
<p id='label1'></p>
<p id='label2'></p>
<p id='label3'></p>
<p id='label4'></p>
</body>
<script>
var myString = "搞事,搞事,一天到晚就知道搞事";
document.getElementById('label1').innerHTML = myString.fontsize(20);
document.getElementById('label2').innerHTML = myString.fontcolor('Red');
document.getElementById('label3').innerHTML = myString.link("http://www.jianshu.com/users/e39da354ce50/latest_articles");
document.getElementById('label4').innerHTML = myString.strike();
</script>
效果图如下.
数组
JavaScript数组对象的创建比较简单,如下所示.
var myArray = new Array;
myArray[0] = "骚栋";
myArray[1] = "栋哥";
myArray[2] = "宾哥";
myArray[3] = "达哥";
数组对象所对应的方法就比较多了,这里也说一下几个常用的.我就直接拿上面创建的数组来做示例说明了.
-
数组排序
数组的排序是使用函数sort()实现的,包括实现字符串数组和数字数组的排序.该方法会改变原来的数组,而不会创建新的数组.示例如下所示.
document.write("原始数组:"+"<br>"+myArray + "<br>" + "<br>");
myArray.sort();
document.write("操作后的数组:"+"<br>"+myArray + "<br>");
结果如下所示.
-
数组颠倒
数组颠倒主要是使用reverse()方法用于颠倒数组中元素的顺序.该方法会改变原来的数组,而不会创建新的数组.示例如下所示.
document.write("原始数组:"+"<br>"+myArray + "<br>" + "<br>");
myArray.reverse();
document.write("操作后的数组:"+"<br>"+myArray + "<br>");
结果如下所示.
-
数组删除/插入元素
OC中的数组插入和删除元素完全的两个方法,但是在JavaScript中数组的插入和删除shift用splice()这一个方法即可解决.函数形式以及参数解释如下所示.
比如我们现在要在下标为2的位置添加元素,并不删除任何原数组的任何一个元素,那么我们只需要把index设置为2,howmany参数为0,然后插入参数即可.代码可以如下.
document.write("原始数组:"+"<br>"+myArray + "<br>" + "<br>");
myArray.splice(2,0,"三爷");
document.write("操作后的数组:"+"<br>"+myArray + "<br>");
效果图如下所示.
再例如,我们只想删除从下标2开始的两个元素,那么我们的代码操作就可以如下所示.
document.write("原始数组:"+"<br>"+myArray + "<br>" + "<br>");
myArray.splice(2,2);
document.write("操作后的数组:"+"<br>"+myArray + "<br>");
效果如下所示.
日期
日期对象也是一种比较常用的对象类型.我们创建一个日期对象,如果不对这个对象进行任何赋值操作,那么它默认的就是当前日期,如下所示.
var nowDate = new Date;
document.write("<br>"+nowDate);
效果如下所示.
与OC类似,我们可以通过set/get方法分别对当前的date对象设置时间和获取时间.常用方法列表如下所示.
| 名称 | 设置(输入参数) | 获取(具有返回值) |
|---|---|---|
| 天 | setDate() | getDate() |
| 月 | setMonth() | getMonth() |
| 年 | setFullYear() | getFullYear() |
| 星期几 | setDay() | getDay() |
| 时 | setHours() | getHours() |
| 分 | setMinutes() | getMinutes() |
| 秒 | setSeconds() | getSeconds() |
| 毫秒 | setMilliseconds() | getMilliseconds() |
| 距1970.1.1的毫秒数 | setTime() | parse() |
| 时间部分字符串 | 无 | toTimeString() |
| 日期部分字符串 | 无 | toDateString() |
比如我们设置天以及获取天数,代码如下所示.页面当然就是显示7了.
var nowDate = new Date;
nowDate.setDate(7);
document.write("<br>"+nowDate.getDate());
JavaScript 算数对象
JavaScript的算数对象主要是用于计算任务,比如输入0~1之间的随机数,我们可以如下输入代码.
var number = Math.random();
document.write(number);
再例如我们可以比较两个数的大小.用max()和min()两个函数即可.例如
var maxNumber = Math.max(1,2);
document.write(maxNumber);
然后,我看看教程还有一些常用的算数值,这里做一个列表分享出来.
| 算数值名称 | Math对象表示 |
|---|---|
| 常数 | Math.E |
| 圆周率 | Math.PI |
| 2 的平方根 | Math.SQRT2 |
| 1/2 的平方根 | Math.SQRT1_2 |
| 2 的自然对数 | Math.LN2 |
| 10 的自然对数 | Math.LN10 |
| 以 2 为底的 e 的对数 | Math.LOG2E |
| 以 10 为底的 e 的对数 | Math.LOG10E |
JavaScript 正则表达式
JavaScript 的RegExp对象跟OC的谓词的功能差不多,主要是用于字符串的比较,以前我就在华山论剑之iOS NSPredicate(谓词)的使用(一)写过OC的谓词使用,并且在华山论剑之iOS NSPredicate(谓词)的使用(二)中说到过关于常用正则表达式的使用.今天我们说一下JS中的RegExp对象的使用.
RegExp对象创建函数实际上是有pattern和attributes两个参数,pattern参数用来填写正则表达式的模式或其他正则表达式.attributes参数则是一个可选的字符串，包含属性 "g"、"i" 和 "m"，分别用于指定全局匹配、区分大小写的匹配和多行匹配。
RegExp(pattern, attributes)
RegExp对象主要有三个方法,test()和exec()以及compile().
-
test()
test()函数检索字符串中的指定值,返回值是 true 或 false.示例如下所示.
var searching = new RegExp('D');
var nameString = 'ShenJingSaoDong';
document.write(searching.test(nameString));
返回值为true.
-
exec()
和test()函数不同的是,exec()虽然也是检索字符串中的指定值,但是它的返回值是检索值或者是null.例如,
var searching = new RegExp('D');
var nameString = 'ShenJingSaoDong';
document.write(searching.exec(nameString));
-
compile()
compile()主要是用于修改pattern和attributes这两个参数.例如,
var searching = new RegExp('D');
var nameString = 'ShenJingSaoDong';
document.write(searching.exec(nameString));
searching.compile('S');
document.write(searching.exec(nameString));
结束
JavaScript对象的分析讲解基本就到这了,这里我决定分享关于JavaScript对象方法的详细内容传送门🚪,初学JavaScript,可能有很多地方写的不是很全面,希望各个大神前来批评指导,最后祝大家在双十一的日子里能找到属于自己的另外一半,成功脱单.
