重学JavaScript系列之一_引用类型

Eastboat
209 阅读4分钟

重学JavaScript系列之一_引用类型

ECMAScript中，引用数据是一种数据结构，用于将数据和功能组织在一起，有时候被称为类

  • ES6中使用Class定义一个类

  • 引用类型的值（对象）是引用类型的一个实例

  • 对象是某个特定引用类型的实例，新对象是使用new操作符跟后面的一个构造函数来创建的,构造函数本身就是一个函数，只不过是处于创建新对象的目的而定义的,如下，创建一个Person类的实例person

    function Person(name,age,sex) {
    this.name=name;
    this.age=age;
    this.sex=sex;
}
var person=new Person('Eastboat',18,'man');

    ​

Object类型

​ js是基于对象的一门语言，我们看大的大多数引用类型的值都是Object的实例 ，js本身无法做到真正面向对象语言的继承、多态、抽象性，所以我们只能通过他的语言特性去实现这些，每年发布的js版本都吸收借鉴了其他语言的特点，给我们带来了很多实用的帮助。

  1. 创建方式

    • new一个Object对象

      var person=new Object();
person.name='Eastboat';
person.sex=18;
person.age='man';

    • 对象字面量

      var person={
    name:"Eastboat",
    age:18,
    sex:'man'
}
//通过此方式创建对象的时候是不会调用Object构造函数的.注：火狐早期版本会调用

/*
 通过对象字面量我们可以很方便的封装我们的数据，成为函数传递大量参数的首选方式
*/

function checkPerson(args){
    if(args.name=='Eastboat'){
       	alert(args.name)
    }else if(args.age>=18){
        alert("adult")
    }else{
        //......
    }
}
checkPerson({
    name:"Eastboat",
    age:12
})

    • 自定义构造函数，如开篇所示，后续章节会衍生讲解

      ​

  2. 访问属性

    • 点语法 obj.key
    • 中括号语法 obj[key] 注: key是以字符串方式存在

Array类型

​ 几乎所有的编程语言都原生支持数组，因为数组是最简单的内存数据结构，但是在js语言中，数组可以保保存不同类型的值。

  1. 创建方式

    • 通过new Array()可以创建和初始化数组，当然，这并不是最好的创建方式

      var arr01 = new Array()   //声明初始化一个空数组
var arr02 = new Array(10)  //指定length为10的数组
var arr03 = new Array('a','b','c')  //直接将元素作为参数传递给构造器

    • 通过字面量方式创建初始化

    var arr=['a','b',3,4,5]

  2. 特点

    • length属性不是只读的，可以通过length去往数组末尾移出或添加新的一项
    • 数组最后一项的索引始终是length-1

  3. 类型监测

if(value instanceof Array) {
   	// 此方法问题只能在一个全局执行环境中存在，如果页面包含多个框架那就存在多个全局执行环境
    // 从而存在两个以上不同版本的Array构造函数
}

if(Array.isArray(value)) {
 	//ECMAScript5新增的方法，最终可以确定某个值是不是数组   
}

  1. 常用方法

    • 添加元素 push/unshift

      //在JavaScript中数组是一个可以修改的对象，如果添加元素，数组会动态的增长
var arr = [0,1,2,3,4];
arr[arr.length]=5  //  arr=> [0,1,2,3,4,5]

//push方法：插入元素到末尾同时返回新的长度
var arr = [0,1,2,3,4];
arr.push('a','b') //  arr=>  [0,1,2,3,4,'a','b']

//插入元素到首位
var arr = [0,1,2,3,4];
for(var i=arr.length; i>0; i--) {
    arr[i]=arr[i-1]
}
arr[0]=-1  //变量腾出首位位置，然后插入数据  arr=> [-1,0,1,2,3,4]

//unshift方法： 把元素插入到数组的首位并返回新的长度
var arr= [0,1,2,3,4];
arr.unshift(-1)  // arr=> [-1,0,1,2,3,4]

    • 删除元素 pop/shift

      //从数组首位删除元素
var arr = [0,1,2,3,4];
for(var i=0; i<arr.lenght; i++) {
    arr[i]=arr[i+1]  //左移一位，数组长度未改变，多出一个undefined  [1,2,3,4,undefined]
}
//pop方法：   删除末尾元素并返回被删除的元素 ，结合push我们可以模拟基本的栈-数据结构

// shift方法 ： 删除首位元素并返回被删除的元素 ，结合unshift我们可以模拟基本的队列-数据结构
var arr = [0,1,2,3,4];
console.log(arr.shift())  // 0

    • 任意位置添加和删除元素 splice

      ```javascript
/*
	splice() 方法向/从数组中添加/删除项目，然后返回被删除的项目。	

	两个参数表示删除元素
	参数一表示起始索引
	参数二表示删除的元素个数
	以下表述从索引为2的元素开始删除三个元素
*/
var arr = [0,1,2,3,4];
arr.splice(2,3)   //  arr=> [0,1]

 /*
 	三个参数表示添加元素
 	参数一表示插入元素的索引
 	参数二表示删除的元素个数
 	参数三表示添加到数组中的值
 	以下表述从索引为4的元素开始删除0个元素,往后插入5,6,7,8
 */
 var arr = [0,1,2,3,4];
 arr.splice(arr.length,0,5,6,7,8);   //arr=> [ 0, 1, 2, 3, 4, 5, 6, 7,8 ]

```

    • 合并数组 concat

      var arr1 = 0;
var arr2 = [1,2,3,4,5];
var arr3 = [11,22,33]'
var res = arr3.concat(arr2,arr3) //  [11,22,33,1,2,3,4,5,0]

    • 迭代器函数 我会单独在一个章节叙述，包括ES6新增的方法 ​

    ​

avatar
文章
阅读
粉丝