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中live方法的重复绑定说明
Oct 21 Javascript
js字符串截取函数substr substring slice使用对比
Nov 27 Javascript
js使用ajax读博客rss示例
May 06 Javascript
JavaScript人脸识别技术及脸部识别JavaScript类库Tracking.js
Sep 14 Javascript
多功能jQuery树插件zTree实现权限列表简单实例
Jul 12 Javascript
JavaScript获取URL中参数querystring的方法详解
Oct 11 Javascript
微信小程序中实现一对多发消息详解及实例代码
Feb 14 Javascript
在Vue组件化中利用axios处理ajax请求的使用方法
Aug 25 Javascript
在Vue组件中使用 TypeScript的方法
Feb 28 Javascript
vue单页面应用打开新窗口显示跳转页面的实例
Sep 21 Javascript
实例详解vue中的$root和$parent
Apr 29 Javascript
微信打开网址添加在浏览器中打开提示的办法
May 20 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
叶罗丽:为什么大家对颜冰这对CP非常关心,却对金茉两人十分冷漠
2020/03/17 国漫
PHP入门学习的几个不错的实例代码
2008/07/13 PHP
Zend Studio for Eclipse的java.lang.NullPointerException错误的解决方法
2008/12/06 PHP
php实现格式化多行文本为Js可用格式
2015/04/15 PHP
PHP使用NuSOAP调用Web服务的方法
2015/07/18 PHP
php对二维数组进行相关操作(排序、转换、去空白等)
2015/11/04 PHP
PHP中的session安全吗?
2016/01/22 PHP
php表单加入Token防止重复提交的方法分析
2016/10/10 PHP
JavaScript中Math对象使用说明
2008/01/16 Javascript
javascript 仿QQ滑动菜单效果代码
2010/09/03 Javascript
javascript学习笔记(十一) 正则表达式介绍
2012/06/20 Javascript
jquery 动态创建元素的方式介绍及应用
2013/04/21 Javascript
js实现仿网易点击弹出提示同时背景变暗效果
2015/08/13 Javascript
jQuery实现带有洗牌效果的动画分页实例
2015/08/31 Javascript
layui选项卡效果实现代码
2017/05/19 Javascript
响应式框架Bootstrap栅格系统的实例
2017/12/19 Javascript
webpack搭建vue 项目的步骤
2017/12/27 Javascript
vscode配置vue下的es6规范自动格式化详解
2019/03/20 Javascript
Vue+Element实现表格编辑、删除、以及新增行的最优方法
2019/05/28 Javascript
操作按钮悬浮固定在微信小程序底部的实现代码
2019/08/02 Javascript
vue下canvas裁剪图片实例讲解
2020/04/16 Javascript
[01:08:10]2014 DOTA2国际邀请赛中国区预选赛 SPD-GAMING VS LGD-CDEC
2014/05/22 DOTA
利用python程序生成word和PDF文档的方法
2017/02/14 Python
使用Python AIML搭建聊天机器人的方法示例
2018/07/09 Python
关于Pycharm无法debug问题的总结
2019/01/19 Python
在TensorFlow中实现矩阵维度扩展
2020/05/22 Python
HTML5手指下滑弹出负一屏阻止移动端浏览器内置下拉刷新功能的实现代码
2020/04/10 HTML / CSS
宝拉珍选美国官网:Paula’s Choice美国
2018/01/07 全球购物
教师产假请假条范文
2014/04/10 职场文书
施工单位安全责任书
2014/07/24 职场文书
工作失职检讨书(精华篇)
2014/10/15 职场文书
党建工作整改措施
2014/10/28 职场文书
在酒桌上的敬酒词
2015/08/12 职场文书
消防安全培训工作总结
2015/10/23 职场文书
Python中的datetime包与time包包和模块详情
2022/02/28 Python
nginx刷新页面出现404解决方案(亲测有效)
2022/03/18 Servers