JS之对象和数组

作者: fenerchen | 来源:发表于2018-03-09 11:19 被阅读12次

Object类型

是一种引用类型,创建Object类型有2种,1、使用new运算符;2、字面量表示

//使用new 运算符创建Object
var box = new Object(); //new 方式,也可以省略new
box.name = '对象'; //创建属性字段
box.age = 28; //创建属性字段
//字面量
var box={
  name:‘对象’,//属性可以使用字符串:‘name’
age:24,
run:function()//方法
  {
    return 'run';
  }
};

在使用字面量声明Object 对象时,不会调用Object()构造函数(Firefox 除外)。使用delete 删除对象属性delete box.name;

Array类型

数组每个元素可以保存任何类型,数组的大小也是可以调整的。创建Array 类型有两种方式:第一种是new 运算符,第二种是字面量。
1.使用new 关键字创建数组

//可省去new
var box = new Array(); //创建了一个数组
var box = new Array(10); //创建一个包含10 个元素的数组
var box = new Array('xiaoming',28,'教师','beijing'); //创建一个数组并分配好了元素

2、使用字面量方式创建数组

var box = []; //创建一个空的数组
var box = ['xiaoming',28,'教师','beijing']; //创建包含元素的数组
var box = [1,2,]; //禁止这么做,IE 会识别3 个元素
var box = [,,,,,]; //同样,IE 的会有识别问题

和Object 一样,字面量的写法不会调用Array()构造函数。(Firefox 除外)。

方法

1、toLocalString()toString()valueOf()join()

对象和数组都有toLocalString()toString()valueOf()方法.其中toString()valueOf()无论重写了谁,都会返回相同的值。数组会将每个值进行字符串形式的拼接,以逗号隔开。
默认情况下,数组字符串都会以逗号隔开。如果使用join()方法,则可以使用不同的分隔符来构建这个字符串

var box=['aaas','fds','ff'];
console.log(box.join('$'));//aaas$fds$ff

2、push()、pop()栈方法(后进先出)直接改变原数组

var box=['aaas','fds','ff'];
console.log(box.push('书序'));//返回长度,和添加的元素
console.log(box.pop());//'书序'

3、push(),shift()队列方法(先进先出)

var box=['aaas','fds','ff'];
console.log(box.push('书序'));//返回长度4,和添加的元素
console.log(box.shift());//'aaas'

ECMAScript 还为数组提供了一个unshift()方法,它和shift()方法的功能完全相反。unshift()方法为数组的前端添加一个元素。

4、重排序方法(sort()、reverse())改变原数组
reverse(),使数组逆序。
sort(),使数组有序(递增或递减)
sort 方法的默认排序在数字排序上有些问题,因为数字排序和数字字符串排序的算法是一样的。我们必须修改这一特征,修改的方式,就是给sort(参数)方法传递一个函数参数。

var box = [1,2,7,4,5]; //数组
box.sort((a,b)=>{return a-b});//递增排序
console.log(box)//(5) [1, 2, 4, 5, 7]

5、操作方法 concat、slice、splice

  • concat()方法可以基于当前数组创建一个新数组,连接作用,不改变原数组
var box = [1,2,7,4,5]; //数组
var b=box.concat(['div']);
console.log(b)//(6) [1, 2, 7, 4, 5, "div"]
console.log(box)//(5) [1, 2, 7,4, 5]
  • slice(n,m)方法可以基于当前数组获取指定区域并创建一个新数组.不改变原数组,不论n,m是正负,m都不取
var box = [1,2,7,4,5]; //数组

var a=box.slice();//复制数组
console.log(a)//(5) [1, 2, 7, 4, 5]

var b=box.slice(1);//获取下标1-最后的元素
console.log(b)//(4) [2, 7, 4, 5]

var bb=box.slice(1,4);//获取下标1-3的元素
console.log(bb)//(3) [2, 7, 4]

var bbb=box.slice(-1);//获取最后一个元素
console.log(bbb)//【5】
console.log(box)//(5) [1, 2, 7, 4, 5]
  • splice()主要用途是向数组的中部插入元素。改变原数组

1、删除

var box = ['1', 28, '2']; //当前数组
var box2 = box.splice(0,2); //截取前两个元素,从下标0开始,删除2个元素
console.log(box2); //返回截取的元素,(2) ["1", 28]
console.log(box); //剩下的元素,["2"]

2、插入

var box = ['1', 28, '2']; //当前数组
var box2 = box.splice(1,0,'555'); //在下标1处插入’555‘
console.log(box2); //返回截取的元素[],空,因为没有删除
console.log(box); //剩下的元素,(4) ["1", "555", 28, "2"]

3、替换(删除后又插入)

var box = ['1', 28, '2']; //当前数组
var box2 = box.splice(1,1,'555'); //把下标1处元素替换成‘555’,相当于,删除后,又插入元素
console.log(box2); //返回截取的元素[28]
console.log(box); //,返回更改后的数组(3) ["1", "555", "2"]

参考资料:
JavaScript高级程序设计(第3版)
W3school

相关文章

  • 重新认识js复杂类型数据的引用和深浅拷贝

    js 基本概念———— 数据类型 js 深浅拷贝之概念 代码实现 —— 数组和对象的j浅拷贝 代码实现 —— 数组...

  • JS数组以及数组变换

    有关数组 数组对象——一种特殊的对象JS其实没有数组,只使用对象来模拟数组 典型数组和JS数组的区别 典型数组 元...

  • js对象数组深度去重和深度排序

    js对象数组深度去重和深度排序 要点:使用collect.js处理数组和对象 https://github.com...

  • 概念集合

    JS中的数组和Arrary的区别 js中的数组就是array对象

  • php的写时复制(和js对比)

    php和js 对于数组 / 对象的处理

  • js遍历数组和遍历对象的区别

    js遍历数组和遍历对象的区别

  • JS面试之对象(2)

    序列文章 JS面试之函数(1)JS面试之数组的几个不low操作(3) 前言 一篇彻底搞懂对象,从此不用担心没对象啦...

  • JS面试之函数(1)

    序列文章 JS面试之对象(2)JS面试之数组的几个不low操作(3) 前言 这段时间突然发现JS原生好多东西都忘记...

  • 数组检测

    检测是否是数组: 数组转字符串: 字符串转换数组: js对象转换成js字符串: js字符串转换成js对象:

  • JS 数组

    JS 数组是一种特殊的对象,不是真正的数组,它只##是通过对象来模拟数组。 JS 数组的定义 let arr = ...

网友评论

    本文标题:JS之对象和数组

    本文链接:https://www.haomeiwen.com/subject/wysufftx.html