JavaScript对象学习小结


Posted in Javascript onSeptember 02, 2015

JavaScript 对象

JavaScript 提供多个内建对象,比如 String、Date、Array 等等。

对象只是带有属性和方法的特殊数据类型。

在JavaScript中,几乎用到的每个js都离不开它的对象。下面我们深入了解一下js对象。

js中对象的分类跟之前我们学过的语言中函数的分类一样,一个是系统自带的叫预定义对象,一个是用户自己写的叫自定义对象。

大体内容如下图所示:

JavaScript对象学习小结

 一:核心对象

1.Array对象

数组对象,用来创建数组,使用new 创建

常用的方法如下图:

JavaScript对象学习小结

常用属性:

JavaScript对象学习小结

通过例子说明Array对象的创建和使用,如下。

<script language="javascript"> 
  var data=new Array("1","2","3");//创建数组data 
  document.writeln("data的初始内容为:"+data+","); //输出数组内容 
  function fun(){  //自定义函数fun()显示数组长度 
    if(this.length!=0){ 
      document.writeln("<PRE>此数组的长度为:"+this.length+"</PRE>"); 
    }else{ 
      document.writeln("<PRE>此数组的长度为0</PRE>"); 
    } 
  } 
  Array.prototype.fun=fun; //为Array对象添加fun()方法 
  data.fun();        //调用fun()方法 
  data=new Array();//清空data数组内容 
  data.fun();//显示清空后数组的长度 
</script>

运行结果:

JavaScript对象学习小结

说明:

prototype用于添加新的属性和方法,用法为:Array.prototype.functionName=functionName

2,Function对象

Function对象可以在程序执行的过程中动态生成函数并调用函数。

常用属性如下:

JavaScript对象学习小结

JavaScript对象学习小结

常用方法如下:

下面实例说明:

<script language="javascript"> 
    funSum=new Function("x","y","z=x+y;return z");   //创建函数funSum()  
 
    x=prompt("请输X值:",""); 
    y=prompt("请输Y值:",""); 
     
    x=Number(x); 
    y=Number(y); 
    alert(newfun(x,y));  //调用函数并输出 
</script> 

注意:Function对象不可写成小些的function。Function是对象,用于动态创建函数,function是关键字,通过function new出来的函数也是Function对象的实例。

3,String对象

String对象提供了对字符串进行处理的属性和方法。使用时可以直接赋值也可以通过new创建后再赋值

String对象有很多方法,主要是用户有关字符串在Web页面中的显示格式,字体大小,字体颜色,字符的搜索以及字符的大小写转换方面的功能。

JavaScript对象学习小结

    通过以上对象的prototype属性,我们也看到了JavaScript的特点,它不仅提供给我们一些功能,还提供给用户自己添加功能的方法,简直是太好了。

二:文档对象

document对象,接触JavaScript的第一个例子是通过ID名称获取控件的名称,里面就用到document,当时没有多想,就当是关键字过了。

document对象是window对象的属性,也是唯一的即属于BOM又属于DOM的对象。

说到window对象,我们首先来看一下window中各对象间的关系。如下图:

JavaScript对象学习小结

了解了大体结构关系,接下看看看document对象的常用属性:

JavaScript对象学习小结

有关document对象的方法,这里说说使用最频繁的.write()/.writeln()方法。这两个方法的作用都是打印字符,不同的是writeln打印完后多了个换行。 

下面写一个用document对象的write方法动态添加JavaScript文件的实例

<script language="javascript"> 
  document.write("<script type=\"text/javascript\" src=\"textuser.js\">"+"</scr"+"ipt>"); 
</script>

这里主要想说明</script>为什么是分开的。

我们可以先看一下分开写的网页源码:

JavaScript对象学习小结

看不出什么不同,接下来我们看一下不分开时网页源码:

JavaScript对象学习小结 

  结果很明显,如果不分开写</script> 会和前面的<script>配对,这样,浏览器会提示我们有误。

三:事件对象

event对象是一种只与事件处理过程有关的对象。

JavaScript中的事件跟vb中学过的事件一致,有鼠标事件,键盘事件,加载事件,等。。

事件的发生肯定有其出发者,触发发生后,这一事件也就随即结束。

事件在JavaScript中使用很简单,就是在关键字前加On。

以上本文给大家分享的javascript对象学习小结,欲了解更多,请持续关注本站。

Javascript 相关文章推荐
基于jQuery的仿flash的广告轮播代码
Nov 04 Javascript
深入理解Javascript里的依赖注入
Mar 19 Javascript
js判断游览器类型及版本号的代码
May 11 Javascript
JQuery中使用on方法绑定hover事件实例
Dec 09 Javascript
js实现模拟计算器退格键删除文字效果的方法
May 07 Javascript
js中遍历Map对象的简单实例
Aug 08 Javascript
JavaScript 实现的checkbox经典实例分享
Oct 16 Javascript
JS实现给对象动态添加属性的方法
Jan 05 Javascript
mui上拉加载更多下拉刷新数据的封装过程
Nov 03 Javascript
js精确的加减乘除实例
Nov 14 Javascript
完美解决手机浏览器顶部下拉出现网页源或刷新的问题
Nov 30 Javascript
如何利用JS将手机号中间四位变成*号
Sep 29 Javascript
JS实现可点击展开与关闭的左侧广告代码
Sep 02 #Javascript
jquery实现华丽的可折角广告代码
Sep 02 #Javascript
javascript学习总结之js使用技巧
Sep 02 #Javascript
jQuery实现固定在网页顶部的菜单效果代码
Sep 02 #Javascript
自定义刻度jQuery进度条及插件
Sep 02 #Javascript
JQuery操作textarea,input,select,checkbox方法
Sep 02 #Javascript
javascript中for/in循环及使用技巧
Sep 01 #Javascript
You might like
PHP执行速率优化技巧小结
2008/03/15 PHP
PHP如何读取由JavaScript设置的Cookie
2017/03/22 PHP
PHP实现cookie跨域session共享的方法分析
2019/08/23 PHP
Javascript倒计时代码
2010/08/12 Javascript
jquery中实现简单的tabs插件功能的代码
2011/03/02 Javascript
js实现浏览器的各种菜单命令比如打印、查看源文件等等
2013/10/24 Javascript
JS不能跨域借助jquery获取IP地址的方法
2014/08/20 Javascript
轻松创建nodejs服务器(6):作出响应
2014/12/18 NodeJs
解决WordPress使用CDN后博文无法评论的错误
2015/12/15 Javascript
TypeOf这些知识点你了解吗
2016/02/21 Javascript
mvc 、bootstrap 结合分布式图简单实现分页
2016/10/10 Javascript
jQuery实现背景滑动菜单
2016/12/02 Javascript
浅谈JavaScript的innerWidth与innerHeight
2017/10/12 Javascript
nodejs使用express获取get和post传值及session验证的方法
2017/11/09 NodeJs
Vue 换肤的示例实践
2018/01/23 Javascript
vue动态路由配置及路由传参的方式
2018/05/23 Javascript
浅谈vue使用axios的回调函数中this不指向vue实例,为undefined
2020/09/21 Javascript
python同时给两个收件人发送邮件的方法
2015/04/30 Python
django rest framework 数据的查找、过滤、排序的示例
2018/06/25 Python
对numpy中二进制格式的数据存储与读取方法详解
2018/11/01 Python
python logging模块的使用总结
2019/07/09 Python
django框架使用views.py的函数对表进行增删改查内容操作详解【models.py中表的创建、views.py中函数的使用,基于对象的跨表查询】
2019/12/12 Python
HTML5添加禁止缩放功能
2017/11/03 HTML / CSS
马来西亚最热门的在线时尚商店:FashionValet
2018/11/11 全球购物
英国门销售网站:Green Tree Doors
2020/01/07 全球购物
类和结构的区别
2012/08/15 面试题
UNIX操作系统结构由哪几部分组成
2016/02/17 面试题
商务邀请函范文
2014/01/14 职场文书
消防器材管理制度
2014/01/28 职场文书
大二自我鉴定
2014/01/31 职场文书
道路施工安全责任书
2014/07/24 职场文书
2015年教育实习工作总结
2015/04/24 职场文书
父亲节感言
2015/08/03 职场文书
创业计划书之小型广告公司
2019/10/22 职场文书
使用python创建股票的时间序列可视化分析
2022/03/03 Python
Redis+AOP+自定义注解实现限流
2022/06/28 Redis