引用类型

引用类型

Object类型

  • 创建实例:
var person = new Object() (用的少)等价于 var person = {}
person.name = 'kangkang'
person.age = 18
// new 操作符

var person = {
  name:'kangkang',
  age:18,
  6:true
}
// 字面量表示法
//这里的name 称为属性,属性名可以用字符串。参见json

封装多个可选参数

function displayInfo(args) {    
  var output = ''
  if(typeof args.name== 'string') {
   console.log(args.name)
}
if( typeof args.age == 'number') {
    console.log(args.age)
}

displayInfo({
    name:'kangkang',
    age:18
})
displayInfo({
    name:'kangkang'
})
  • 用法好在哪里呢?
    当一个函数需要有大量的参数以供使用时,那么这样写就会提供很大便利,这个就是使用对象字面量作为一个参数里封装多个可选参数以供使用。

访问属性

属性的访问一般使用点号,也可以使用方括号属性名要加引号,不过有一个就是属性名为数值时要用方括号并且无需引号括起来(括起来也行)

var person = {
  name:'kangkang',
  age:18,
  6:true
}

console.log(person.age) // 18
console.log(person['age']) // 18
console.log(person[6]) // true
console.log(['6']) //true

Array 类型

JavaScript 中的数组可以保存不同类型的数据

  • 创建方法
  1. Array 构造函数
  2. 字面量方法
var apples = Array(3) // 包含3个 undefined 的的数组
var age = [3] //包含一个数值3 的数组

console.log(apples) //[undefined, undefined, undefined]
console.log(apples.length)  // 3

console.log(age) // [3]
console.log(age) //1 

访问数组数值

通过索引访问

var names = ['xiaoming', 'xiaoqiang', 'xiaojun']
name[0]~ name[2]
console.log(names.length) // 3
  • length 的使用
var names = ['xiaoming', 'xiaoqiang', 'xiaojun']
names.length = 1
console.log(names)
// ["xiaoming"]


names.length = 4
console.log(names)
//["xiaoming", undefined, undefined, undefined]

// 数组的length 属性可以去除和添加项
  • Array.isArray(names)
    检测是否为数组

  • names.toString()
    返回一个数组各项以逗号隔开的一个字符串(注意是组成了一个字符串)

  • names.join('-')
    以指定分隔符分割数组的项并返回组成的一个字符串,不传或者传入undefined 都将使用逗号分割

操作数组的项

pop() 方法

栈方法,先进后出。弹出最上面的项(既然是弹出,就会返回弹出的值),无需参数。

var names = ['xiaoming', 'xiaoqiang', 'xiaojun']

console.log(names.pop()) //["xiaojun"]
console.log(names) // ["xiaoming", "xiaoqiang"]

push() 方法

栈方法,先进后出。推入,将参数依次推入栈中,数据添加到数组末尾,返回最终数组长度。

var names = ['xiaoming', 'xiaoqiang', 'xiaojun']

console.log(names.push('dalong')) // 4
console.log(names) // ["xiaoming", "xiaoqiang","dalong"]

shift() 方法

取出数组第一项并返回

unshift() 方法

按参数中顺序将值添加到数组开头并返回个数

reverse() 方法

var values = [1,2,3,4,5]
values.reverse()
console.log(values) // 5,4,3,2,1

sort() 方法

默认将数组进行从小到大排序,但比较的是项的字符串Unicode位点进行排序,就会出现数值比较时的错误,所以可以传递一个比较函数来指定排布方式

function compare (value ,value2) {
  if(value < value2){
    return -1
}else if (value > value2) {
    return 1
}else {
    return 0
  }
}
// 这是升序排列的比较函数
function compare (value,value2){
   return value - value2
}

function compare (value,value2){
   return value > value2
}
// 这两种形式均是从小到大排列的简写形式
  • 比较函数的机制: sort接受true 和false ,对数组每一项按函数迭代比较,如上面代码,若第一个参数(项) 小于第二个参数(项),如果想转换位置则返回true,sort接受到true后进行位置交换。返回false则位置不变。

splice方法

这是一个很强大的数组方法
  • 删除:可以删除任意的项,接受两个参数,第一个是起始位置,第二个是项数(不是结束位置),返回被删除的项
  • 插入:向指定的位置插入任意数量的项,接受三个参数,分别是起始位置,要删除的项数,要插入的项0(可以是多个项)
  • 替换:这个替换,可以不是等数量项的替换,执行的是先删除再插入的操作,接受的参数分别是,起始位置、要删除的项数、要插入的项。注意到这里要删除的项数如果是0就变成了只有插入功能了。
var colors = ["red", "green", "blue", "black"]

console.log(colors.splice(0,1)) //["red"]
console.log(colors) // ["green", "blue", "black"]
// 删除从0 开始一个项

colors.splice(0,0,'yellow')
console.log(colors) // ["yellow", "green", "blue", "black"]
// 在0位置插入'yellow',项依次后移

colors.splice(1,2,'brown')
console.log(colors) // ["yellow", "brown", "black"]
// 从 1 开始删除两个项,并插入项' brown'

slice()

裁剪,可以接受一个或者两个参数,第一个参数是起始位置,第二个是结束位置(不包括这个项),若只有一个参数,则作为起始位置并至数组末尾,取出起始位置到结束位置的项作为一个新数组返回,不影响原数组。

var colors = ["red", "green", "blue", "black", "yellow", "brown"]
var colors2 = colors.slice(1,3) //['green','blue',']

concat(array)

拼接,可以把参数作为值添加到数组的末尾,如果这个参数是一个数组,则会将数组中的 值拿出添加进去,返回一个被改变的新数组,原数组不变

var colors = ['red','green','blue']
var colors2 = colors.concat('black',['yellow','brown'])


console.log(colors) // ["red", "green", "blue"]
console.log(colors2) // ["red", "green", "blue", "black", "yellow", "brown"]


indexOf() 方法 lastIndexOf()方法

均接受两个参数,分别是要查找的项和起始位置

  • indexOf():从数组开头查找,第二个参数相对于开头位置
  • lastIndexOf(): 从数组末尾开始查找,第二个参数是于末尾位置向前

迭代方法

接受函数作为参数,运行在数组每一项上,接受的函数又可以接受三个形式参数分别作用是:
数组项的值、该项在数组的位置(这个位置经常要用)、数组本身
  • every() :对数组每一项运行给定函数,只有每一项在函数运行后均为true,函数才返回true
  • filter():对数组每一项运行给定函数,返回一个由项在运行后且结果为tru的项e组成的信数组(过滤效果)
  • forEach():对数组每一项运行给定函数,没有返回值
  • map():每一项运行函数,且返回运行后的每一项组成的数组
  • some():对每一项运行函数,只要有一项运行结果为true,则器结果返回true
var numbers = [1,2,3,4,5,6,7,8,9]
var filterResult = numbers.filter(function(item, index ,array){
  return (item >2 )
})
console.log(filterResult)

reduce()方法和 reduceRight()方法

归并,接受两个参数:调用的函数和可选的初始值。调用的函数接受四个参数:前一个值,当前值,索引,数组对象(这个有时会用到)。如果设置了初始值,就用初始值和第一项作为函数的参数,如果没有则是前两项。函数返回的值作为下一次的第一个参数使用,依次遍历数组,直至结束。

  • reduce()方法:从前往后开始

  • reduceRight()方法:从后往前开始

var values = [1,2,3,4,5]
var sum = values.reduce(function(prev, cur, index, array){
  return prev+cur
})
// 这是一个求和的操作

此为看书笔记,仅作为本人备忘使用

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

推荐阅读更多精彩内容

  • 第5章 引用类型(返回首页) 本章内容 使用对象 创建并操作数组 理解基本的JavaScript类型 使用基本类型...
    大学一百阅读 3,233评论 0 4
  • 本章内容 使用对象 创建并操作数组 理解基本的 JavaScript 类型 使用基本类型和基本包装类型 引用类型的...
    闷油瓶小张阅读 681评论 0 0
  •   引用类型的值(对象)是引用类型的一个实例。   在 ECMAscript 中,引用类型是一种数据结构,用于将数...
    霜天晓阅读 1,052评论 0 1
  • 引用类型的值(对象)是引用类型的一个实例。在ECMAScript中,引用类型是一种数据结构,用于将数据和功能组织在...
    AlexTamir阅读 497评论 0 0
  • 前几天闺蜜发微信想找我聊天,我也欣然答应。闺蜜一开始就说了一句,她和她爸妈有半年不联系了。我还调侃她:“那你...
    无牙的小狼狗阅读 281评论 0 0