首页 > 代码库 > 网站前端_JavaScript.0008.JavaScript对象数组
网站前端_JavaScript.0008.JavaScript对象数组
对象简介:
说明: 类/类型是一种数据结构,用于将数据和功能组织在一起,虽然Js是一种面向对象的语言,却不具备传统面向对象那样可以自定义类结构
对象相关:
说明: Object实例虽然不具备多少功能但对于应用程序中的存储和传输数据而言,确实是非常理想的选择
// 创建对象 // - 第一种方式 var newObj = new Object() // - 第二种方式 var newObj = new Object // - 第三种方式 var newObj = { name: "李满满", // 对象属性支持引号括住 ‘age‘: 25, "sex": ‘男‘ } // 添加属性 // - 第一种方式 newObj.name = "刘珍珍" // - 第二种方式 newObj[‘age‘] = 24 // 读取属性 // - 第一种方式 console.log(newObj.name) // - 第二种方式 console.log(newObj[‘age‘]) // 遍历属性 for(key in newObj){ console.log(key, ‘->‘, newObj[key]) } // 对象方法 // - 第一种方式 var newObj = { ‘toRun‘: function (){ return ‘running...‘ } } console.log(newObj.toRun()) // 删除属性 delete newObj.toRun
function userShow(userInfo){ // 可以传递userInfo对象进来对其属性操作 for(key in userInfo){ console.log(key, ‘->‘, userInfo[key]) } } userInfo = {‘userName‘: "李满满", ‘age‘: 25} userShow(userInfo)
注意: 对象可以作为函数的参数传递,而一个对象可以携带无数个属性,所以在实际开发中,常用来向函数传递可选参数的首选方式
数组相关:
说明: Js中的数组每个元素可以保存任何类型,而且大小是可以调整的,但是数组最多包含 4294967295 个元素,超出即会发生异常
// 创建数组(可以省略new) // - 第一种方式 var newArr = new Array() // - 第二种方式 var newArr = new Array(10) // - 第三种方式 var newArr = new Array(‘李满满‘, 25, ‘男‘) // - 第四种方式 var newArr = [‘李满满‘, 25, ‘男‘] // 获取数组长度 var arrLen = newArr.length console.log(arrLen) // 数组元素赋值 newArr[0] = ‘刘珍珍‘ newArr[newArr.length] = ‘XXOO‘ console.log(newArr) // 稍微复杂数组 var newArr = [ { name: ‘李满满‘, age: 25, sex: ‘男‘ }, [‘李满满‘, 25, ‘男‘], ‘25‘, ‘男‘ ]
对象方法:
说明: 对象和数组都具有toLocalString()/toString()/valueOf(),其中toString()和valueOf()无论重写了谁,都会返回相同的值
var userArr = [‘李满满‘, 25, ‘男‘] // 会隐式调用toString() alert(userArr) console.log( // 不会调用toString() userArr, // 和valueOf()返回一致 userArr.toString(), // 和toString()返回一致 userArr.toLocaleString() ) // 使用join()方法,则可以使用不同的分割符来构建字符串 console.log(userArr.join(‘ | ‘))
数组栈方法:
说明: 数组可以像栈一样操作,栈是一种数据结构(后进先出),也就是说最新添加的元素最早被移除,而栈中元素的压入(push())或弹出(pop())只发生在一个位置,也就是栈顶,push()支持接收任意数量的参数,把它们逐个添加到数组的末尾,并返回修改后数组的长度,而pop()方法则从数组末尾移除最后一个元素,减少数组的length的值,然后返回移除的元素
var userInfo = [‘李满满‘, 25, ‘男‘] var newLen = userInfo.push(‘杭州市富阳市‘) console.log(‘数组被压入栈后长度改变为: ‘ + newLen) var lastItem = userInfo.pop() console.log(‘数组弹出最新压入的数据为: ‘ + lastItem)
数组队列方法:
说明: 队列方法是先进先出,队列在数组的末端添加元素,从数组的前端移除元素,通过push()向数组末端添加一个元素,然后通过shift()方法从数组的前端移除一个元素,还有一个unshitf()方法,和shitf()完全相反,为数组的前端添加一个元素,但是在IE浏览器下unshift()方法返回的不是数组的长度而是undefined
var userInfo = [‘李满满‘, 25, ‘男‘] var newLen = userInfo.push(‘杭州市富阳市‘) console.log(‘数组被压入队列后长度改变为: ‘ + newLen) var shitfItem = userInfo.shift() console.log(‘数组从队列头部移除的元素是: ‘ + shitfItem) var newLen = userInfo.unshift(‘李满满‘) console.log(‘向数组头部插入元素后的长度: ‘ + newLen)
数组排序方法:
说明: sort默认按照字符串的方式来比较,导致比较结果出乎意料,常常需要自己编写比较器函数,传递给sort,如果从大到小排序则比较器大于返回1小于返回-1否则返回0
var numArr = [1, 2, 3, 4, 5] console.log( // 倒序排列,原数组被修改,返回排序后的数组 numArr.reverse(), // 正序排序,原数组被修改,返回排序后的数组 numArr.sort() ) var numArr = [‘1f‘, ‘11f‘, ‘2f‘, ‘22f‘] // 定义比较器 function cmp(x, y){ var xVal = parseInt(x) var yVal = parseInt(y) return xVal>yVal?1:(xVal==yVal?0:-1) } // 传入比较器 alert(numArr.sort(cmp))
数组操作方法:
说明: Js已经为包含在数组中的元素提供了很多方法,concat(arrayX...)合并数组,slice(start, end)获取数组指定区域元素,splice()对源数组插入/删除/替换等操作
var userInfo = ["李满满", 25, ‘男‘] // 数组合并-.concat(arrayX....)可以基于当前数组创建一个新的数组,源数组不受影响 // - 第一种方式,参数支持数组,返回值为合并后的数组 var newInfo = userInfo.concat([‘武汉‘]) console.log(newInfo) // - 第二种方式,参数支持非数组,返回值为合并后的数组 var newInfo = userInfo.concat(‘武汉‘, ‘18814818764‘) console.log(newInfo) 注意: 数组对象的concat参数可以为数组或非数组,而且还支持空,这样相当于在数组的深拷贝 // 数组切割 -.slice(start, end)可以基于当前数组,获取指定区域元素并创建一个新数组,包含开始索引但不包含结束索引元素,结束索引支持复数 var newInfo = userInfo.slice(0, 3) console.log(newInfo) // -非常金典的用法是写评级组件 var rate = 3 document.write("★★★★★☆☆☆☆☆".slice(5 - rate, 10 - rate)) // 数组删除 -.splice(index, howmany, item1...itemX),如果只写前两个参数,则会截取从0开始后的2的元素返回,源数组被截取的元素被删除 var deletedItems = userInfo.splice(0, 2) console.log(deletedItems) console.log(userInfo) // 数组插入 -.splice(index, howmany, item1...itemX),如果传多个参数,将用item1..itemX这些元素去覆盖howmany个原有元素,如果howmany为0,在直接就在index的位置插入item1....itemX userInfo.splice(0, 0, ‘李满满‘, 25) userInfo.splice(0, 1, ‘刘珍珍‘) console.log(userInfo)
本文出自 “ζ自动化运维开发之路ζ” 博客,请务必保留此出处http://xmdevops.blog.51cto.com/11144840/1846128
网站前端_JavaScript.0008.JavaScript对象数组