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 相关文章推荐
javascript 用记忆函数快速计算递归函数
Mar 15 Javascript
30分钟就入门的正则表达式基础教程
Feb 25 Javascript
Jquery中扩展方法extend使用技巧
Aug 24 Javascript
jQuery实现选项卡切换效果简单演示
Dec 09 Javascript
举例讲解jQuery中可见性过滤选择器的使用
Apr 18 Javascript
微信小程序 Flex布局详解
Oct 09 Javascript
React-Native之定时器Timer的实现代码
Oct 04 Javascript
angular4实现tab栏切换的方法示例
Oct 21 Javascript
详解最新vue-cli 2.9.1的webpack存在问题
Dec 16 Javascript
详解js类型判断
May 22 Javascript
从零开始在NPM上发布一个Vue组件的方法步骤
Dec 20 Javascript
vue使用i18n实现国际化的方法详解
Sep 05 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下关于Cannot use a scalar value as an array的解决办法
2010/08/08 PHP
解析dedeCMS验证码的实现代码
2013/06/07 PHP
Linux下源码包安装Swoole及基本使用操作图文详解
2019/04/02 PHP
laravel5.6 框架邮件队列database驱动简单demo示例
2020/01/26 PHP
11款基于Javascript的文件管理器
2009/10/25 Javascript
jquery异步跨域访问代码
2013/06/28 Javascript
JavaScript实现QueryString获取GET参数的方法
2013/07/02 Javascript
阿里巴巴技术文章分享 Javascript继承机制的实现
2016/01/14 Javascript
JavaScript知识点总结(十)之this关键字
2016/05/31 Javascript
jQuery实现点击某个div打开层,点击其他div关闭层实例分析(阻止冒泡)
2016/11/18 Javascript
使用Bootstrap Tabs选项卡Ajax加载数据实现
2016/12/23 Javascript
React创建组件的三种方式及其区别
2017/01/12 Javascript
jQuery实现文档树效果
2017/02/20 Javascript
vue引入jq插件的实例讲解
2017/09/12 Javascript
vue脚手架搭建过程图解
2018/06/06 Javascript
JavaScript 中的 this 工作原理
2018/06/20 Javascript
vue实现商品加减计算总价的实例代码
2018/08/12 Javascript
trackingjs+websocket+百度人脸识别API实现人脸签到
2018/11/26 Javascript
Javascript的this详解
2019/03/23 Javascript
JS如何实现封装列表右滑动删除收藏按钮
2020/07/23 Javascript
[01:30]我们共输赢 完美世界城市挑战赛开启全新赛季
2019/04/19 DOTA
[02:07]TI9显影之尘系列 - Vici Gaming
2019/08/20 DOTA
Python读写Excel文件的实例
2013/11/01 Python
Python中字典的基本知识初步介绍
2015/05/21 Python
详解Django中的过滤器
2015/07/16 Python
django实现前后台交互实例
2017/08/07 Python
python实现给scatter设置颜色渐变条colorbar的方法
2018/12/13 Python
Python实用工具FuckIt.py介绍
2019/07/02 Python
Python在终端通过pip安装好包以后在Pycharm中依然无法使用的问题(三种解决方案)
2020/03/10 Python
在服务器上安装python3.8.2环境的教程详解
2020/04/26 Python
Python日志:自定义输出字段 json格式输出方式
2020/04/27 Python
集体备课反思
2014/02/12 职场文书
蓬莱阁导游词
2015/02/04 职场文书
逃出克隆岛观后感
2015/06/09 职场文书
js中Map和Set的用法及区别实例详解
2022/02/15 Javascript
Golang连接并操作MySQL
2022/04/14 MySQL