引用类型

引用类型:

今天,我们来讲一讲引用类型,
其实,在ECMAScript中,引用类型是一种数据结构,用于将数据和功能组织在一起,因为他们描述的是一类对象所具有的属性和方法。

对于对象的创立,可以使用 new 操作符后跟一个构造函数来创建。构造函数本身就是函数,只不过该函数是出于创建新对象的目的而定义的。

var person = new Object();

对于这段代码,创建了 Object 引用类型的一个新实例,然后把该实例保存在了变量 person 中。

接下来,我将会一个一个的讲解引用类型中都有哪些知识点:

(1) Object 类型

到目前为止,我们看到的大多数引用类型值都是 Object 类型的实例

创建Object实例两种方法:

1. var person = new Object();
2  var person = {};

(2) Array 类型

对于 ECMAScript来说,Array 类型和其他语言中的数组类型差别还是比较大的,比如,ECMAScript中,数组每一项可以保存任何类型的数据,而且数组可以动态调整大小。

创建数组的方式有两种:

1. var colors = new Array();
2. var colors = [];

数组最后一项的索引始终是 length-1;

(一)、检测数组

可是,有一个问题,怎么样检测某个对象是不是数组呢?

可以使用 instanceof 来解决,value instanceof Array ,不过 instanceof 有一个问题:

如果网页中有多个框架,即存在多个全局作用域,从而存在多个不同版本的 Array 构造函数,如果从一个框架向另一个框架传入数组,那么传入的数组与在第二个框架中原生创建的数组分别具有各自不同的构造函数。

为了解决这个问题,ECMAScript5 新增 Array.isArray()方法,不过这个方法只支持 IE9+

所以,有个完美解决方案:

function isArray(value){
    return Object.prototype.toString.call(value) == '[object Array]';
}

(二)、转换方法

toString()、toLocaleString()、valueOf()、join()

(三)、栈方法

Ecmascript提供的栈是一种 last-in-first-out 后进先出的数据结构,也就是最新添加的项最早被移除,栈中项的插入和移除,只发生在栈的顶部。

所以,提供了两种方法:
push():接收任意数量参数,并逐个添加到数组末尾,并返回修改后数组的长度;
pop():从数组末尾移除最后一项,减少数组的length值,然后返回移除的项;

(四)、队列方法

队列数据结构的访问规则是 first-in-first-out ,先进先出,在列表的末尾添加项,在列表的前端移除项

提供了shift方法
shift(): 移除数组中第一项,并返回该项,同时将数组长度减1
unshift(): 在数组前端添加任意个项,并返回新数组的长度

(五)、重排序方法

reverse():倒序排列

sort(): 升序排列,sort() 会调用每个数组项的 toString() 方法,然后比较得到的字符串,以确定如何排序,即使数组中的每一项都是数值,sort() 方法比较的也是字符串。

var values = [0,1,5,10,15];
values.sort();
alert(values)  ==> 0,1,10,15,5

sort()比较的事字符串,所以这个方法有问题,解决方案:
接收一个compare()比较函数

function compare(value1, value2){
    if ( value1 < value2 ){
         return -1;
    } else if ( value1 > value2 ){
         return 1;
    } else {
         return 0;
    }
}

var values = [0,1,5,10,15];
values.sort(compare);
alert(values)  ==> 0,1,5,10,15

(六)、操作方法

concat(): 先创建当前数组一个副本,然后将接收到的参数添加到这个副本的末尾,最后返回新构建的数组

slice(a,b):返回数组中a到b的元素
如果a或b是一个负数,则用数组长度加上该数来确定相应的位置

splice() 很强大,大家可以自己了解。

(七)、位置方法
indexOf()和lastIndexOf() --> 直有IE9+才支持

都接收两个参数,要查找的项和表示查找起点位置的索引(可选)

(八)、迭代方法

var numbers = [1,2,3,4,5,6,3,4,5,6];
  1. every():该函数每一项都返回true,则返回true
var flag = numbers.every(function(item, index, array){
    return (item > 2)
})
  1. filter():返回该函数会返回true的项组成的数组
var flag = numbers.filter(function(item, index, array){
    return (item > 2)
})
  1. forEach()

  2. map()

  3. some()

(九)、归并方法

reduce()和reduceRight()

接收两个参数:一个在每一项上调用的函数和(可选的)作为归并基础的初始值。
传给reduce()和reduceRight()的函数接收4个参数:前一个值、当前值、项的索引、数组对象。

var values = [1,2,3,4,5];
var sum = values.reduce(function(prev, cur, index, array){
    return prev + cur;
})

这个函数返回的任何值都会作为第一个参数自动传给下一项。

(5) Function 类型

在ECMAScript中,函数实际上是对象,每个函数都是Function类型的实例,而且都和其他引用类型一样具有属性和方法。由于函数是对象,因此函数名实际上也是一个指向函数对象的指针,不会与某个函数绑定。

  1. 没有重载

将函数名想象为指针,就会理解了为啥没有重载的概念。

function addSome(num){
    return num + 100;
}

function addSome(num){
    return num + 200;
}

var result = addSome(100) ==> 300
  1. 函数声明与函数表达式
    函数声明提升

  2. 作为值的函数

  3. 函数内部属性
    arguments,this

arguments主要用途是保存函数参数,它还有一个叫callee的属性,该属性是一个指针,指向拥有这个arguments对象的函数。

  1. 函数属性和方法

length 和 prototype

function sum(num1, num2){
    return num1 + num2;
}

sum.length ==> 2

每个函数都包含两个非继承而来的方法:apply()和call(),两个方法都是在特定的作用域中调用函数,实际上等于设置函数体内this对象的值。

apply()接收两个参数:一个是在其中运行函数的作用域,另一个是参数数组

function sum(num1, num2){
  return num1 + num2;
}

function callSum1(num1, num2){
  console.log(arguments)
  return sum.apply(this, arguments);
}

function callSum2(num1, num2){

  return sum.apply(this, [num1, num2]);
}

alert(callSum1(10,10))

call()和apply()作用相同,区别仅仅在于接收参数的方式不同。call()的第二个参数必须逐个列举出来。

function sum(num1, num2){
   return num1 + num2;
}

function callSum(num1, num2){
   return sum.call(this, num1, num2);
}

alert(callSum(10,10))

call()和apply()到底用哪一个,取决于你采取哪种给函数传递参数最方便。

他两的最大作用,是能够扩充函数赖以运行的作用域。

window.color = "red";
var o = { color: "blue" };

function sayColor(){
    alert(this.color);
}

sayColor.call(this) ==> "red"
sayColor.call(o) ==> "blue"

(6)、基本包装类型
Boolean、Number、String

实际上,每读取一个基本类型值时,后台就会创建一个对应的基本包装类型对象,从而让我们能够调用一些方法来操作这些数据。

引用类型和基本包装类型的主要区别就在于对象的生存期。使用 new 操作符创建的引用类型的实例,在执行流离开当前作用域之前都一直保存在内存中。而自动创建的基本包装类型的对象,则只存在于一行代码的执行瞬间,然后立即被销毁。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 200,176评论 5 469
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 84,190评论 2 377
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 147,232评论 0 332
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 53,953评论 1 272
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 62,879评论 5 360
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,177评论 1 277
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,626评论 3 390
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,295评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,436评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,365评论 2 317
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,414评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,096评论 3 315
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,685评论 3 303
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,771评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,987评论 1 255
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,438评论 2 346
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,032评论 2 341

推荐阅读更多精彩内容