深入JavaScript高级程序设计之对象、数组（栈方法，队列方法，重排序方法，迭代方法）

继承是OO语言中的一个最为人津津乐道的概念。 许多OO语言都支持两种继承方式：接口继承和实现继承。 接口继承只继承方法签名，而实现继承则继承实际的方法。 如其所述，由于函数没有签名，在ECMAScript中无法实现接口继承。 ECMAScript只支持实现继承，而且其实现继承主要是依靠原型链来实现的。

1.使用对象字面量定义对象

var person={};

使用这种方式创建对象时，实际上不会调用Object构造函数。

开发人员更喜欢对象字面量的语法。

2.有时候需要传递大量可选参数的情形时，一般来讲使用对象字面量来封装多个可选参数。

3.对象属性的点表示法与方括号表示法的区别

(1)功能上：两者没区别

(2)但是方括号的有点是可以通过变量来访问属性

例如：

  var person={
  name:"Nic"
}

点表示法：person.name

方括号表示法：var prop=“name”;
                        person[prop]

(3)还有一个优点是：

如果属性名中包含会导致语法错误的字符或者关键字，保留字时候，使用方括号不会错

例如：person["first name"]="OK";

(4)通常，建议使用点表示法

4.创建数组的问题

var colors=[1,2,]    //不要这样。这样会创建一个包含2个或3个项的数组
var opy=[,,,,,]    //不要这样。这样会创建一个包含5个或6个项的数组

这是因为IE8及之前的版本在实现数组字面量方面有bug

使用字面量创建数组时，不会调用Array构造函数

5.如果设置某个值的索引超过了数组现有项数。

如：var color=[1,2,3]

color[3]时，数组会自动增加到该索引值加1的长度

这时，color[3]的值就是undefined

6.数组的length不只是只读的。通过设置length该属性，可以不断向数组末尾添加新项。

7.数组转换成字符串 toString() join()

array.toString()  //返回以逗号分隔的字符串
array.valueOf()  //返回的还是数组
array.join(",")  //也可以

8.数组的栈方法 push() pop()

栈是一种数据结构，也就是最新添加的项最早被移除（后进先出）。而栈中项的插入和移除，只发生在一个位置--栈的顶部。
ECMAScript提供了push()与pop()方法来实现这种栈。

push() 方法可向数组的末尾添加一个或多个元素，并返回新的长度。

pop() 方法用于删除并返回数组的最后一个元素。

例子：

var arr=[];
var count=arr.push('a','b');  //count=2
arr.push('c');
var item=arr.pop();  //移除最后一项 c item=c 并且改变数组长度

9.队列方法 shift() unshift()

队列数据的访问规则是先进先出
ECMAScript提供了shift()来实现。
shift() 方法用于把数组的第一个元素从其中删除，并返回第一个元素的值。
unshift() 方法可向数组的开头添加一个或更多元素，并返回新的长度。

10.重排序方法 sort() reverse()

ECMAScript提供了sort()与reverse()来实现。

sort()会调用每个数组项的tostring()方法，比较得到的字符串来排序。

11.数组的拼接 concat()

concat() 方法用于连接两个或多个数组。

该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。

12.slice() 方法可从已有的数组中返回选定的元素。

13.位置方法：indexOf()与lastIndexOf()

14.迭代方法

ECMAScript5定义了下列5种方法，该5种方法都接收三个参数：数组项的值，该项在数组中的位置，数组对本身

every(),filter(),forEach(),map(),some()

例子：

var num=[1,2,3,4];
var res=num.every(function(item,index,array){
  return (item>2)
})  //false  必须每一项都大于2，才返回true
var res=num.some(function(item,index,array){
  return (item>2)
})  //true 只要有一个大于2，就返回true
var res=num.filter(function(item,index,array){
  return (item>2)
})  //[3,4]
var res=num.forEach(function(item,index,array){
  return (item>2)
})  //[1,4,9,16]

javascript 数组对象中的迭代方法

/* javascript 数组对象中的迭代方法
 * ECMAScript5为数组定义了5个迭代方法。每个方法都接受两个参数，第一个是进行迭代的函数，第二个是该函数的作用域对象【可选】。 

 * 进行迭代的函数接受三个参数，第一个是数组中要进行迭代的元素的值，第二个是数组候总要进行迭代的元素的位置，第三个是迭代数组本身。 

* 1. every()  对数组中的每一项运行给定的函数，如果该函数对每一项都返回true，则返回true
 * 2. filter() 对数组中的每一项运行给定的函数，返回该函数返回true的项组成的数组。
 * 3. forEach() 对数组中的每一项运行给定的函数，这个方法没有返回值
 * 4. map()   对数组中的每一项运行给定的函数，返回每次函数调用的结果组成的数组
 * 5. some()  对数组中的每一项运行给定的函数，如果该函数对任意一项返回true，则返回true
 *
 * 这些迭代方法支持的浏览器有，IE9+，Firefox2+，Safari3+，Opera 9.5+，chrome
 */
var num = [1,2,3,4,5,6,7,8,9];
var everyResult = num.every(function(item, index, array) {
  if(item > 2) {
    return true;
  }
});
alert(everyResult);
var someResult = num.some(function(item) {
  if(item > 2) {
    return true;
  }
});
alert(someResult);
var filterResult = num.filter(function(item) {
  if(item > 2) {
    return true;
  }
});
alert(filterResult);
var mapResult = num.map(function(item) {
  if(item > 2) {
    return true;
  }
});
alert(mapResult);
var forEachResult = num.forEach(function(item) {
  if(item > 2) {
    return true;
  }
});
alert(forEachResult);
赞 (0)

相关推荐

  • JS的数组迭代方法

    本文实例讲述了JS的数组迭代方法.分享给大家供大家参考.具体实现方法如下: <!doctype html> <html> <head lang="zh"> <meta charset="utf-8"> <title>js数组迭代</title> <meta name="renderer" content="webkit"> <script

  • 详谈JS中数组的迭代方法和归并方法

    数组的迭代方法 ES5中为数组定义了5个迭代方法.每个方法都要接收两个参数:要在每一项上面运行的函数和(可选的)运行该函数的作用域对象---影响this的值. 传入方法中的函数会介绍三个参数:1.数组项的值 2. 该项在数组的中位值 3. 数组对象本身: every()和some()方法 every():对数组中的每一项运行给定函数,如果每一项都返回true,则返回true,否则false: some():对数组中的每一项运行给定函数,如果至少有一项返回true,则返回true,否则false:

  • JavaScript数组迭代器实例分析

    本文实例讲述了JavaScript数组迭代器用法.分享给大家供大家参考.具体如下: 这里注意:如果数组中有0.false."".null.NaN迭代器将会停止 function createIterator(x) { var i = 0; return function(){ return x[i++]; }; } var iterator=createIterator(['a','b','c','d','e','f','g']); var current; while(current

  • javascript中Array数组的迭代方法实例分析

    本文实例讲述了javascript迭代的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: //filter() 利用指定的函数确定是否返回数组中包涵的某一项 var num = [1,2,3,4,5,6,12]; num.filter(function(item, index, array){ return (item > 2); //[3, 4, 5, 6, 12] }); //map() 返回一个数组,数组中每一项都是在原始数组中的对应项上运行传入参数的结果 var nu

  • js 数组实现一个类似ruby的迭代器

    js 数组实现一个类似ruby的迭代器

    分为如下几节: ·基本实现 ·在迭代中引用原来的对象,或者直接改变数组的值而不是返回一个新数组 ·向迭代传入无限多的参数 ·基本实现 今天突然发现js的数组处理起来真是麻烦,代码一些就是一大堆,相比起ruby的迭代器来真是逊色不少,主要是要写的代码太多了,也许是js有特殊的处理数组的方式,真是我不知道而已,但是我真的想自己给js实现一个类似ruby的迭代器的东东,而且实现起来也不难,那就开始动手吧. 真的应该庆幸js是动态语言啊,如果是静态语言,实现起来很不方便(别说要我重新定义一个继承自arr

  • JavaScript数组迭代方法

    最近工作中经常涉及到数据的处理,数组尤其常见,经常需要对其进行遍历.转换操作,网上的文章零零散散,不得已自己又找出红宝书来翻出来看,顺便记一笔,便于以后查询. 数组常用的迭代方法 ECMAScript5为数组定义了5个迭代方法.每个方法都接受两个参数:要在每一项上运行的函数fn和(可选的)运行该函数的作用域对象--影响 `this` 的值. 传入这些方法中的函数(fn)会接收3个参数:item .index .array; 如: array.forEach(function(item,index

  • js数组的五种迭代方法及两种归并方法(推荐)

    js数组的五种迭代方法及两种归并方法(推荐) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta ht

  • javaScript数组迭代方法详解

    本文为大家介绍了javaScript数组迭代方法,供大家参考,具体内容如下 每个方法都接收两个参数:要在每一项上运行的函数  和  (可选的)运行该函数的作用域对象. 传入这些方法中的函数会接收三个参数:数组项的值,该项在数组中的位置,数组对象本身. forEach()  对数组中的每一项运行 给定函数.该方法没有返回值. every()  对数组中的每一项运行 给定函数,如果数组的每一项都返回true,则返回true. some()  对数组中的每一项运行 给定函数,如果数组的任意一项返回tr

  • JavaScript数组的5种迭代方法

    ES5为数组定义了5个迭代方法.每种方法都接收两个参数.要在每一项上运行的函数和(可选的)运行该函数的作用域对象--影响this的值.//其中(可选的)这个参数暂时未遇到过. 其中,函数都接收三个参数(数组中的每一项.每一项的索引值.数组对象本身). 下面是5中方法的介绍: every() : 对数组中的每一项执行函数,如果每一项都返回 true ,则该方法返回 true. some():     对数组中的每一项执行函数,只要有一项返回了 true ,则该方法返回 true. filter()

  • 深入JavaScript高级程序设计之对象、数组（栈方法，队列方法，重排序方法，迭代方法）

    继承是OO语言中的一个最为人津津乐道的概念. 许多OO语言都支持两种继承方式:接口继承和实现继承. 接口继承只继承方法签名,而实现继承则继承实际的方法. 如其所述,由于函数没有签名,在ECMAScript中无法实现接口继承. ECMAScript只支持实现继承,而且其实现继承主要是依靠原型链来实现的. 1.使用对象字面量定义对象 var person={}; 使用这种方式创建对象时,实际上不会调用Object构造函数. 开发人员更喜欢对象字面量的语法. 2.有时候需要传递大量可选参数的情形时,一

  • JavaScript高级程序设计 阅读笔记（十九） js表格排序

    排序代码 复制代码 代码如下: function SortTable(sTableID, iCol, sDataType){ this.oTable=document.getElementById(sTableID); this.oTBody=this.oTable.tBodies[0]; this.colDataRows=this.oTBody.rows; this.aTRs=[]; this.iCol=iCol; this.sDataType=sDataType; } SortTable.p

  • JavaScript高级程序设计（第3版）学习笔记6 初识js对象

    在房子里面可以放你想放的任意事物--如果你有足够的美学造诣,你甚至可以弄一个房中房试试--当然,为了方便管理,我们会给房子里存放的所有事物都会取上一个不重复的名字,比如医药房间里的各种药品名称.在ECMAScript中,你可以在对象中存放任意你想放的数据,同样,我们需要给存放的数据取一个名字--也就是对象的属性名,再存放各种数据.再看看ECMA-262中对象的定义:无序属性的集合,其属性可以包含简单数据类型值.对象或者函数. 进入对象,我开始有些激动了,说实话,让我想起做这系列学习笔记的最初原因

  • JavaScript高级程序设计（第三版）学习笔记1~5章

    第2章,在html中使用JavaScript Html引入外部js脚本 <script type="text/javascript" src="test.js">两个</script>之间不应放脚本,因为并不会被执行</script> <script>标签有一个defer属性可以延迟脚本执行,但是并不保证会按脚本排列顺序执行 建议:将脚本引入放在<body>标签的所有内容之后,而不放在<head>

  • JavaScript高级程序设计（第3版）学习笔记8 js函数（中）

    6.执行环境和作用域 (1)执行环境(execution context):所有的JavaScript代码都运行在一个执行环境中,当控制权转移至JavaScript的可执行代码时,就进入了一个执行环境.活动的执行环境从逻辑上形成了一个栈,全局执行环境永远是这个栈的栈底元素,栈顶元素就是当前正在运行的执行环境.每一个函数都有自己的执行环境,当执行流进入一个函数时,会将这个函数的执行环境压入栈顶,函数执行完之后再将这个执行环境弹出,控制权返回给之前的执行环境. (2)变量对象(variable ob

  • JavaScript高级程序设计（第3版）学习笔记9 js函数（下）

    再接着看函数--具有魔幻色彩的对象. 9.作为值的函数 在一般的编程语言中,如果要将函数作为值来使用,需要使用类似函数指针或者代理的方式来实现,但是在ECMAScript中,函数是一种对象,拥有一般对象具有的所有特征,除了函数可以有自己的属性和方法外,还可以做为一个引用类型的值去使用,实际上我们前面的例子中已经有过将函数作为一个对象属性的值,又比如函数也可以作为另一个函数的参数或者返回值,异步处理中的回调函数就是一个典型的用法. 复制代码 代码如下: var name = 'linjisong'

  • JavaScript高级程序设计（第3版）学习笔记7 js函数（上）

    变量类型 在说函数之前,先来说说变量类型. 1.变量:变量在本质上就是命名的内存空间. 2.变量的数据类型:就是指变量可以存储的值的数据类型,比如Number类型.Boolean类型.Object类型等,在ECMAScript中,变量的数据类型是动态的,可以在运行时改变变量的数据类型. 3.变量类型:是指变量本身的类型,在ECMAScript中,变量类型就只有两种:值类型和引用类型.当变量的数据类型是简单数据类型时,变量类型就是值类型,当变量的数据类型是对象类型时,变量类型就是引用类型.在不引起

  • JavaScript高级程序设计（第三版）学习笔记6、7章

    第6章,面向对象的程序设计 对象: 1.数据属性 configurable,表示能否通过delete删除属性从而重新定义属性,能否修改属性的特性,或能否把属性修改为访问器属性,默认为true enumerbale,表示能否通过for-in访问属性,默认true ƒwritable,表示能否修改属性值,默认true „value,数据存储位置,默认undefined 修改默认属性特性:Object.defineProperty(),接收三个参数:属性所在对象,属性名,描述符对象,描述符对象属性必

  • JavaScript高级程序设计之基本引用类型

    JavaScript高级程序设计之基本引用类型

    目录 1.Date 2.RegExp 3.原始包装类型 前言: 引用值(对象)都是某个特定的引用类型的实例对象,例如 Date类型.Function类型,RegExp 正则表达式类型等等.JavaScript内置了一些常用的引用类型给开发者使用. 1.Date 下面3个方法返回的单位为毫秒的时间戳 let t1 = Date.UTC(2020, 11, 7, 22,14) let t2 = Date.parse("5/23/2020") let t3 = Date.now() pars

  • javascript中类的定义及其方式(《javascript高级程序设计》学习笔记)

    关于javascript中类的继承可以参考阮一峰的Blog<Javascript继承机制的设计思想>,说的很透. 一.在javascript中实例化遇到的问题: 下面用<javascript高级程序设计>中的例子来做说明,假如现在定义了一个car的对象,它是Object类的实例.像下面这样的: 复制代码 代码如下: var oCar=new Object(); oCar.color = "red"; oCar.doors = 4; oCar.mpg = 23;

随机推荐