位置: 编程技术 - 正文

JavaScript基础篇(3)之Object、Function等引用类型(javascript基础编程)

编辑:rootadmin

推荐整理分享JavaScript基础篇(3)之Object、Function等引用类型(javascript基础编程),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:javascript基础笔记,javascript基础编程,javascript零基础,javascript教程chm,javascript基础编程,javascript 基础,javascript 基础,javascript基础入门视频教程,内容如对您有帮助,希望把文章链接给更多的朋友!

阅读目录

Object类型

1、通过构造函数来创建2、通过字面量表示法来创建对象

Array类型

同样Array也有两种创建方式:如果我们想要打印数组中所有的值,直接打印数组的变量名就可以:往数组添值:栈方法、队列方法: 关于数组的排序: 数组的一些操作方法:查找位置方法迭代方法

归并方法

Date类型

RegExp类型

Function类型

三种表示法:

方法重载函数内部属性(arguments 和 this)

基本包装类型

浏览器的内置对象URI 编码方法

总结

我们在《一步步学习javascript基础篇(1):基本概念》中简单的介绍了五种基本数据类型Undefined、Null、Boolean、Number和String。今天我们主要介绍下复杂数据类型(即引用数据类型)

Object类型

我们用的最多的引用类型就属object类型了,一般用来存储和传输数据是再好不过的。然,它的两种创建方式我们是否了解呢?

1、通过构造函数来创建

如: var obj = new Object();

在js中的引用类型有个非常灵活的用法,可以动态的附加属性和赋值。

如:

2、通过字面量表示法来创建对象

现在大家用得比较多的就是字面量表示法来创建对象了。

如:

和上面的效果是等效的。通过这样方式创建感觉结构更加的清晰,更加有封装的感觉。:)

我们还可以这样用

如:

如:

是不是感觉很强大很灵活呢?我在访问属性的时候一般都是点出来,但是还有另外的方式。

如:(我们可以使用中括号的形式来访问属性值)

例:

Array类型

除了object之外,应该属数组用的最多了。下面来罗列下常见用法。

同样Array也有两种创建方式:

上面两种方式是等效的,我们可以直接通过下标的方式来访问数组: alert(arr[2]); 。

如果我们想要打印数组中所有的值,直接打印数组的变量名就可以:

例:

例:

上面直接打印arr2,我们发现默认都是以逗号分隔的。那么有时候,我们不想用逗号怎么办呢。那你可能可以用到join方法

往数组添值:

我们可以直接: arr2[4] = 7; arr2[5] = 8;

还有一种更加巧妙地添值方式: arr2[arr2.length] = 9; arr2[arr2.length] = ; ,下标length刚好是数组最大长度的下一个,添加值后length再次动态自动累计。

栈方法、队列方法:

什么是栈?(后进先出)。什么是队列?(先进先出),我们怎样用数组来模仿这种数据结构的访问方式?下面通过一张图来解释下数组对象提供的四个方法。

从图可以看出:shift和push、unshift和pop的组合可以实现栈的数据结构访问,shitf和pop、shift和unshift的组合可以实现队列的数据机构访问方式。 这里需要注意:pop和shift取数据的同时,数组中对于的值也同时移除了。

例:

关于数组的排序:

关于数组的排序有sort(正)reverse(反)。

先看个例子,大家猜想下结果:

然结果并不是我们想要的:

为什么会这样呢?因为sort不会直接比较数字类型,而已转为string了再做的比较。那么我们想要比较数字怎办?我们可以往sort传函数,例:

有人会问o1和o2是怎么来的?这是sort函数规定的。这样说大家可能不好接受。下面,我们自己来模拟下sort的排序,大家就明白了。

当然,我们模拟的并不是那么的好,大概就是这么个意思。

反序就简单了:(直接reverse()就可以了)

数组的一些操作方法:concat创建一个新的副本,并合并传进来的参数

JavaScript基础篇(3)之Object、Function等引用类型(javascript基础编程)

slice创建一个新的副本,取数组的位置数据

splice会改变原数组数据,可实现对数组的删、插和替换

查找位置方法

indexOf()和 lastIndexOf(),就是查找在数组中的位置,和string中的对应方法差不多。

迭代方法

&#; every():对数组中的每一项运行给定函数,如果该函数对每一项都返回 true,则返回 true。&#; filter():对数组中的每一项运行给定函数,返回该函数会返回 true 的项组成的数组。&#; forEach():对数组中的每一项运行给定函数。这个方法没有返回值。&#; map():对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组。&#; some():对数组中的每一项运行给定函数,如果该函数对任一项返回 true,则返回 true。

以上方法都不会修改数组中的包含的值。

如:

其中。forEach和map区别不大,只是一个有返回值,一个没有。实际中我们用forEach比较多,下面我们模拟forEach的实现。

归并方法

reduce()和 reduceRight(),这两个方法是比较有意思的,以前还真没接触过。先看例子,再解释:

也是个循环,第一次执行 prev 是 1, cur 是 2。第二次, prev 是 3(1 加 2 的结果), cur 是 3(数组的第三项)。这个过程会持续到把数组中的每一项都访问一遍,最后返回结果。reduceRight只是方向相反。

下面我们来模拟:

Date类型

我们很多时候需要测试一个函数的性能,可以取它的执行进过时间:

下面列出一些常用方法

getTime() 返回表示日期的毫秒数;与valueOf()方法返回的值相同setTime(毫秒) 以毫秒数设置日期,会改变整个日期getFullYear() 取得4位数的年份(如而非仅)getUTCFullYear() 返回UTC日期的4位数年份setFullYear(年) 设置日期的年份。传入的年份值必须是4位数字(如而非仅)setUTCFullYear(年) 设置UTC日期的年份。传入的年份值必须是4位数字(如而非仅)getMonth() 返回日期中的月份,其中0表示一月, 表示十二月getUTCMonth() 返回UTC日期中的月份,其中0表示一月, 表示十二月setMonth(月) 设置日期的月份。传入的月份值必须大于0,超过则增加年份setUTCMonth(月) 设置UTC日期的月份。传入的月份值必须大于0,超过则增加年份getDate() 返回日期月份中的天数(1到)getUTCDate() 返回UTC日期月份中的天数(1到)setDate(日) 设置日期月份中的天数。如果传入的值超过了该月中应有的天数,则增加月份setUTCDate(日) 设置UTC日期月份中的天数。如果传入的值超过了该月中应有的天数,则增加月份getDay() 返回日期中星期的星期几(其中0表示星期日, 6表示星期六)getUTCDay() 返回UTC日期中星期的星期几(其中0表示星期日, 6表示星期六)getHours() 返回日期中的小时数(0到)getUTCHours() 返回UTC日期中的小时数(0到)setHours(时) 设置日期中的小时数。传入的值超过了则增加月份中的天数setUTCHours(时) 设置UTC日期中的小时数。传入的值超过了则增加月份中的天数getMinutes() 返回日期中的分钟数(0到)getUTCMinutes() 返回UTC日期中的分钟数(0到)setMinutes(分) 设置日期中的分钟数。传入的值超过则增加小时数setUTCMinutes(分) 设置UTC日期中的分钟数。传入的值超过则增加小时数getSeconds() 返回日期中的秒数(0到)getUTCSeconds() 返回UTC日期中的秒数(0到)setSeconds(秒) 设置日期中的秒数。传入的值超过了会增加分钟数setUTCSeconds(秒) 设置UTC日期中的秒数。传入的值超过了会增加分钟数getMilliseconds() 返回日期中的毫秒数getUTCMilliseconds() 返回UTC日期中的毫秒数setMilliseconds(毫秒) 设置日期中的毫秒数setUTCMilliseconds(毫秒) 设置UTC日期中的毫秒数getTimezoneOffset() 返回本地时间与UTC时间相差的分钟数。例如,美国东部标准时间返回。在某地进入夏令时的情况下,这个值会有所变化

RegExp类型

两种表示法:

后面的参数代表模式,如:g:表示全局(global)模式、i:表示不区分大小写(case-insensitive)模式、m:表示多行(multiline)模式

关于正则了解不是很清楚,后期有机会在单独学习整理正则这块。

Function类型

三种表示法:

以上三种都是可行的,不过我们平时用得比较多的是第一种,第二种也有用,第三种用得比较少,但是最能看出function的本质,其实就是一个Function对象的实例。

我们来看看1和2的区别。

因为js解析器是从上到下的解析,在执行sum2的时候还没有定义,所以报异常。但是sum1比较特殊,是申明式的。在执行sum1之前就会”预解析“(函数声明提升)。相当于把sun1的定义提到了最上面(放到源代码树的顶部)。

方法重载

严格来说,js中是没有方法重载的,不过我们可以根据参数的个数来模拟。(还有,js中函数的形参我们是不确定类型的)

例:上面并没有出现我们预料中的结果,因为第二次定义的sun1不是实现的重载,而是直接覆盖了第一次的定义。下面,我们就简单的模拟实现方法重载:

函数内部属性(arguments 和 this)

arguments:类数组对象,包含着传入函数中的所有参数。下面通过arguments实现上面的模拟重载:

我们在第一篇博文里面有提一个问题:

六、

不过,并没有同学去解答,有人可能觉得太简单,或是不乐意懒得去解答。这题的答案是:

为什么会是这个答案呢?好像和我们预料中的不一样。下面我们图解:

我们可能发现了一个问题,那就是第4步调用的已经不是所在的这个函数本身了(也就是没有递归了),这不是我们想要的。我们要的是,不管外面怎么改变,4处都代表所在的函数指针。那么我们可以用到arguments的callee方法,例:

函数的另一个内部属性this:

首先我们看看这样一个问题:

为什么会有不同的结果?我们记住一句话,一般情况"哪个对象点出来的方法,this就是哪个对象"。上面的例子其实等效于:

虽然"哪个对象点出来的方法,this就是哪个对象",但是有时候我们不想要这样的结果,我们不想用对象点或者对象点出了想this是另外的对象。那么我们可以使用call:

传如的第一个参数,直接赋值给函数里面的this。和call类似的有apply,区别看下面:

基本包装类型

在这个系列的第一篇中有个问题:

四、

为什么会是这样的结果?因为str1.name2设置值的时候访问的是string的包装类,然后再次访问str1.name2之前就把之前那个包装类已经被销毁。

为什么要有包装类?

因为可以像操作引用对象一样操作基本数据类型,如: var s1 = "some text"; var s2 = s1.substring(2);

哪些基本类型有包装类&#;

Boolean、Number和String类型。

浏览器的内置对象

Global(其实也就是我们平时用的window)和Math(一些计算功能)

URI 编码方法

这是一个js中最最最强大的函数了,相对与一个独立的解析器。如我文中的操作实例就是用这个函数实现的。

如:

效果图:

当然,你还的引入jqeruy问题,博客园中默认就已经引入了。所以,你不需要再次引入,你测试的话是看不到alert弹框的,因为博客园禁掉了。我的是用的jquery ui中的Dialog对话框做的。

javascript中eval和with用法实例总结 本文实例讲述了javascript中eval和with用法。分享给大家供大家参考,具体如下:我们都知道javascript的作用域机制,但是with和eval有时会破坏我们对于作用

全面解析Bootstrap排版使用方法(文字样式) 一、段落段落是排版中另一个重要元素之一。在Bootstrap中为文本设置了一个全局的文本样式(这里所说的文本是指正文文本):1、全局文本字号为px(fo

基于js实现微信发送好友如何分享到朋友圈、微博 微信浏览器内置了javascript私有对象WeixinJSBridge,可以实现发送给朋友、分享到朋友圈、分享到微博等功能。scriptvarimgUrl="图片地址";varlineLink="当前网址";v

标签: javascript基础编程

本文链接地址:https://www.jiuchutong.com/biancheng/386339.html 转载请保留说明!

上一篇:全面解析Bootstrap排版使用方法(标题)(全面解析朝鲜战争)

下一篇:javascript中eval和with用法实例总结(js中的eval)

  • 考税务师的报考条件
  • 出租房屋取得的收入计入什么
  • 印花税减免优惠政策2020
  • 年末结转净利润
  • 工业总产值收入法
  • 所得税申报表里季初资产是指什么
  • 金税盘坏了更换需要几天
  • 人民币报关出口跨境
  • 工程检测单位
  • 金税三期报税软件
  • 房租租金收入都缴纳什么税金
  • 以前年度社保计提出错了怎么调整
  • 购原材料红字发票会计分录怎么写?
  • 旅行社开哪里比较好
  • 管理服务费入什么科目
  • 实收资本印花税税率
  • 土方运输费会计分录
  • 私车公用税务处理
  • 促销费属于哪个税目
  • 待认证进项税额借贷方向
  • 房地产开发公司取名
  • 长期股权投资年度损益影响金额包括什么
  • 公司工会发给职工的福利
  • 小规模纳税人可以开专票吗
  • macbook pro怎么检测
  • 其他流动负债包含
  • ajax无刷新技术
  • php的数组函数
  • Linux系统中怎么定位到java代码的方法级
  • 修改配置文件是什么意思
  • 福利补贴属于工资吗
  • 无形资产出租怎么开具发票
  • mysql事务执行流程
  • php中session什么意思
  • 有什么办法解决前进中的问题
  • 手把手教你如何套路男神
  • laravel 实例
  • 功能强大的php文件有哪些
  • 附清单格式
  • 销售价格低于成本价,税务机关是否有权纳税调整?
  • vite 插件开发
  • 开发区政府退税政策合法吗
  • 一般纳税人和小规模纳税人怎么界定
  • 企业的净利润率
  • 被投资公司注销把钱转到投资公司怎么做帐
  • 提供加工修理修配劳务包含哪些
  • 购进货物用于建筑安装
  • 专用发票跨月退税怎么办
  • 安全生产费如何计量
  • 短信收到电子退库收入什么意思
  • 短期流动负债计算公式
  • 领用自产应税消费品用于财务人员职工福利
  • 五险一金缴纳比例2023
  • 社保返还补贴政策2020
  • 差旅费出差补助标准
  • 长期借款的账务处理会计分录
  • 不动产产权的取得
  • 价外费用计入哪个科目
  • 企业需要报哪些税
  • 冲销销售收入分录
  • 手写发票还能用么
  • 预付款项给供应商合法吗
  • debian系统如何安装软件
  • mac怎样解压缩
  • Qq浏览器怎么切换成极速模式
  • win8.1系统安装教程
  • xp注册表文件在哪
  • win10右键菜单不显示
  • windows执行bat命令
  • cocos2dx游戏案例
  • 获取本机ip地址命令
  • listview安卓
  • unity怎么替换模型位置
  • centos 安装完成后无法启动
  • 超详细的卡拉赞攻略
  • android缓存清理
  • 保险的佣金一般是多少
  • 房地产企业预缴税款最新规定
  • 全资子公司和全资子企业的区别
  • 纳税申报期限和税款缴纳期限一样吗
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设