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 相关文章推荐
tbody元素支持嵌套的注意方法
Mar 24 Javascript
Jquery 获得服务器控件值的方法小结
May 11 Javascript
一个JavaScript变量声明的知识点
Oct 28 Javascript
JS判断移动端访问设备并加载对应CSS样式
Jun 13 Javascript
jQuery获得document和window对象宽度和高度的方法
Mar 25 Javascript
js实现内容显示并使用json传输数据
Mar 16 Javascript
js获取json中key所对应的value值的简单方法
Jun 17 Javascript
JavaScript实现简单的星星评分效果
May 18 Javascript
vue父组件异步获取数据传给子组件的方法
Jul 26 Javascript
vue-cli3.0配置及使用注意事项详解
Sep 05 Javascript
bootstrap-table实现表头固定以及列固定的方法示例
Mar 07 Javascript
浅谈Vue.set实际上是什么
Oct 17 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
造就帕卡马拉的帕卡斯是怎么被发现的
2021/03/03 咖啡文化
用php实现让页面只能被百度gogole蜘蛛访问的方法
2009/12/29 PHP
php获取文件内容最后一行示例
2014/01/09 PHP
C#使用PHP服务端的Web Service通信实例
2014/04/08 PHP
ThinkPHP模板替换与系统常量及应用实例教程
2014/08/22 PHP
使用php方法curl抓取AJAX异步内容思路分析及代码分享
2014/08/25 PHP
PHP实现简单实用的分页类代码
2016/04/08 PHP
PHP+Ajax实现的博客文章添加类别功能示例
2018/03/29 PHP
深入理解JavaScript系列(1) 编写高质量JavaScript代码的基本要点
2012/01/15 Javascript
使用按钮控制以何种方式打开新窗口的属性介绍
2012/12/17 Javascript
jquery右下角弹出提示框示例代码
2013/10/08 Javascript
JavaScript中的包装对象介绍
2015/01/27 Javascript
jquery移动点击的项目到列表最顶端的方法
2015/06/24 Javascript
JavaScript算法系列之快速排序(Quicksort)算法实例详解
2016/09/04 Javascript
点击页面任何位置隐藏div的实现方法
2016/09/05 Javascript
html中鼠标滚轮事件onmousewheel的处理方法
2016/11/11 Javascript
D3.js中强制异步文件读取同步的几种方法
2017/02/06 Javascript
从零开始在vue-cli4配置自适应vw布局的实现
2020/06/08 Javascript
python基础教程之lambda表达式使用方法
2014/02/12 Python
对python中词典的values值的修改或新增KEY详解
2019/01/20 Python
python中update的基本使用方法详解
2019/07/17 Python
Python Django实现layui风格+django分页功能的例子
2019/08/29 Python
基于python的itchat库实现微信聊天机器人(推荐)
2019/10/29 Python
python获得命令行输入的参数的两种方式
2020/11/02 Python
python3.9.1环境安装的方法(图文)
2021/02/02 Python
Python 的 f-string 可以连接字符串与数字的原因解析
2021/02/20 Python
HTML5中微数据概述及在搜索引擎中的使用举例
2013/02/07 HTML / CSS
iPhoneX安全区域(Safe Area)底部小黑条在微信小程序和H5的屏幕适配
2020/04/08 HTML / CSS
汽车专业学生自我评价
2014/01/19 职场文书
大型会议接待方案
2014/03/01 职场文书
工作能力自我评价2015
2015/03/05 职场文书
信用卡催款律师函
2015/05/27 职场文书
党课主持词大全
2015/06/30 职场文书
新店开张宣传语
2015/07/13 职场文书
Css预编语言及区别详解
2021/04/25 HTML / CSS
go web 预防跨站脚本的实现方式
2021/06/11 Golang