JavaScript面向对象中的Array类型个人分享

KnewOne 发布于2019-08-26 12:17 / 2800人阅读

摘要：类型检测数组示例代码调用结果为方法作用用于判断当前对象的数据类型结果特点可以准确判断出当前变量的类型调用结果为调用结果为报错调用结果为调用结果为方法判断指定类型是否出现在当前对象的原型链中调用结果为转换数组提供了两种方法用于数组的转

Array类型 检测数组

示例代码:

var arr = [1,2,3,4,5];
console.log(arr instanceof Array);//调用结果为 true
/*
    Object.prototype.toString.call()方法
      * 作用 - 用于判断当前对象的(数据)类型
      * 结果 - [object Array]
      * 特点 - 可以准确判断出当前变量的类型
 */
console.log(Object.prototype.toString.call(arr));// 调用结果为 [object Array]

console.log(typeof null);// object

// console.log(null instanceof Null)// 调用结果为 报错

console.log(null instanceof Object);// 调用结果为 false

console.log(Object.prototype.toString.call(null));// 调用结果为 [object Null]

// Object.prototype.isPrototypeOf()方法 - 判断指定类型是否出现在当前对象的原型链中
console.log(Array.prototype.isPrototypeOf(arr));// 调用结果为 true

console.log(Array.isArray(arr));// true

转换数组

JavaScript提供了两种方法,用于数组的转换

toString()方法 - 把数组转换为字符串,并返回结果

valueOf()方法 - 返回数组对象的原始值

示例代码:

var arr = [1,2,3,4,5];
/*
    利用toString()方法将数组转换为字符串
      * 结果 - 多个数组元素被逗号( , ) 进行分隔组成的字符串
 */
console.log(arr.toString());// 调用结果为 1,2,3,4,5

console.log(arr.valueOf());// 调用结果为 [1,2,3,4,5]

var obj = {
    name : "皮卡丘"
};
console.log(obj.valueOf());// 调用结果为 { name: "皮卡丘" }

进出栈方法

所谓栈就是数据结构,(先进后出)这个结构就叫栈

示例代码:

var arr = [1,2,3,4,5];

/* 在指定的数组的最后面添加指定的元素 */
arr.push(6);
console.log(arr);
/* 删除指定数组的最后一个元素并返回被删除的数组 */
arr.pop();
console.log(arr);

/* 在指定的数组的最前面添加指定元素 */
arr.unshift(7);
console.log(arr);
/* 删除指定数组的最前面的一个元素并返回被删除的数组 */
arr.shift();
console.log(arr);

分析图:

排序方法

注意 - reverse()和sort()方法的返回值是经过排序之后的数组

注意: 使用if进行判断如果形参中的 a < b 排序方式是由大到小进行排列
如果 a > b 排序方式是由小到大进行排列

注意返回值是负数的情况下是无效的

示例代码:

/*
    reverse()方法 - 表示反转数组的元素顺序(就是把顺序给到过来)
 */
var arr = [3,1,2,3,4,5,21];
// console.log(arr.reverse());// 调用结果为 [ 5, 4, 3, 2, 1 ]

/*
    sort()方法 - 表示数组的元素进行排列(就是正常顺序排列)
 */
var result = arr.sort();
console.log(result);// 调用结果为 [ 1, 2, 3, 4, 5 ]
console.log(arr);// 调用结果为 [ 1, 2, 3, 4, 5 ]


/*
    使用if进行判断如果形参中的 a < b 排序方式是由大到小进行排列
    如果 a > b 排序方式是由小到大进行排列
    * 注意返回值是负数的情况下是无效的
 */

var result = arr.sort(function (a,b) {
    if (a < b){
        /* 返回值 */
        return 1;
    }
});
console.log(arr);// 调用结果为 [ 1, 2, 3, 3, 4, 5, 21 ]
console.log(result);// 调用结果为 [ 1, 2, 3, 3, 4, 5, 21 ]

控制台效果代码图:

连接方式

concat()方法 - 表示连接两个或多个数组,并返回结果

就是把concat()方法中括号里的元素和原有数组的元素添加到一起并返回结果

示例代码:

var arr = [1,2,3,4,5];
console.log(arr.concat(6));// 调用结果为 [ 1, 2, 3, 4, 5, 6 ]
console.log(arr.concat([9,10,"J","O","K"]));// 调用结果为 [ 1, 2, 3, 4, 5, 9, 10, "J", "O", "K" ]

控制台效果图:

操作方法

特点 - 可以删除指定元素的位置并且给指定的位置添加新的元素

示例代码:

var arr = [1,2,3,4,5];
/*
    splice(start, deleteCount)方法
    * 作用 - 用于删除当前数组中指定位置指定个数的元素
    * 参数
      * start - 表示删除的开始位置
      * deleteCount - 表示删除的个数
    * 返回值 - 将删除的元素组成的新数组进行返回
 */
// var result = arr.splice(0, 5);
// console.log(result);// 调用结果为 [ 1, 2, 3, 4, 5 ]
// console.log(arr);// 调用结果为 []

/*
    splice(start, deleteCount, item1, item2, ...)方法
    * 作用 - 向指定数组的指定位置添加元素
    * 参数
      * start - 表示删除的开始位置
      * deleteCount - 表示删除的个数
      * item1, item2, ... - 表示向数组添加的元素
    * 返回值 - 将删除的元素组成的新数组进行返回
 */
var result = arr.splice(0, 0, 6,7,8);
console.log(result);// 调用结果为 []
console.log(arr);// 调用结果为 [ 6, 7, 8, 1, 2, 3, 4, 5 ]

var result = arr.splice(0, 3, 6,7,8);
console.log(result);// 调用结果为 [ 1, 2, 3 ]
console.log(arr);// 调用结果为 [ 6, 7, 8, 4, 5 ]

/*
    slice()方法
    * 作用 - 截取指定数组中的元素
    * 参数
      * begin - 表示开始截取的位置(从 0 开始)
      * end - 表示结束截取的位置(截取最后一个位置的下一个位置)
    * 返回值 - 返回截取的元素组成的新数组
 */
var result = arr.slice(2,3);
console.log(result);// 调用结果为 [3]

检索方法

indexOf()和lastindexOf()方法

用于检索数组中是否包含指定的元素内容 - 并且返回元素所在的位置

indexOf() - 表示从左至又的顺序进行检索

lastIndexOf() - 表示从右至左的顺序进行检索

注意 - 如果在同一个数组当中有重复的元素存在,则会匹配到第一个被查找到的元素信息的位置

比如 - (indexOf就是从左到右开始找第一个相符的元素,lastIndexOf就是从右到左找第一个相符的元素)

如果检索的元素并不在指定数组中时 - 那么返回的结果为 -1(这是固定的)

示例代码:

var arr = ["葫芦娃","哪吒","皮卡丘","哪吒","舒克","贝特"];

console.log(arr.indexOf("哪吒"));// 调用结果为 1
console.log(arr.lastIndexOf("舒克"));//调用结果为 4
console.log(arr.indexOf("哆啦A梦"));// 调用结果为 -1

forEach( )方法

Array.prototype.forEach()方法

作用 - 用于遍历指定数组

参数

callback - 表示回调函数

currentValue - 表示遍历数组得到每个元素

index - 表示遍历数组得到每个元素对应的索引值

array - 表示遍历的数组

示例代码:

var arr = ["皮卡丘","葫芦娃","舒克","贝特","叮当猫"];

arr.forEach(function (currentValue,index,array) {
    console.log(array);
});

控制台示例图:

GPU云服务器云服务器 javascript 面向对象 javascript面向对象 javascript面向对象编程 javascript面向对象编程指南

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/108400.html

JavaScript面向对象中的String类型个人分享

摘要：类型大小写转换表示将小写内容转换为大写内容表示将大小内容转换为小写内容示例代码构造函数方式表示将小写内容转换为大写内容表示将大小内容转换为小写内容调用结果为调用结果为控制台调用效果图根据指定位置获取字符串表示通过指定字符串中指定字符 String类型大小写转换 toUpperCase() - 表示将小写内容转换为大写内容 toLowerCase() - 表示将大小内容转换为小写内容...

Fundebug 2019-08-26 12:18 评论0 收藏0
听飞狐聊JavaScript设计模式系列01

摘要：前言大家好，小弟飞狐，爱学习，爱装逼，乐于分享，初来乍到，请多多关照。特别注意一下，函数在中是对象，不是一种数据类型，这可是世界的一等公民。和，和的关系又很暧昧，后面细说，要不然会晕菜。基本数据类型，，，，，这五种基本数据类型是按值访问的。前言大家好，小弟飞狐，爱学习，爱装逼，乐于分享，初来乍到，请多多关照(～ o ～)~zZ。出道几年，对JavaScript情有独钟，聊技术之前，...

CHENGKANG 2019-08-21 10:44 评论0 收藏0
JavaScript面向对象中的原型个人分享

摘要：原型原型是什么所谓原型就是类型对象的一个属性在函数定义时就包含了属性它的初始值是以个空对象在中并没有定义函数的原型类型所以原型可以是任何类型原型是用于保存对象的共享属性和方法的原型的属性和方法并不会影响函数本身的属性和方法示例代码类型的属性原型原型是什么所谓原型(Prototype)就是Function类型对象的一个属性在函数定义时就包含了prototype属性,它的初始值是...

pakolagij 2019-08-26 12:14 评论0 收藏0
JavaScript面向对象中的错误与异常个人分享

摘要：错误与异常错误与异常概念所谓错误就是错误就是程序中不正常的运行状态在其他编程语言中称为异常或错误解释器会为每个错误情况创建并且抛出一个对象对象包含错误的描述信息语句语句作用用于捕获和处理代码中的错误语句作用用于处理语句中出现的错误语句错误与异常错误与异常概念所谓错误就是错误就是程序中不正常的运行状态在其他编程语言中称为异常或错误解释器会为每个错误情况创建并且抛出一个Erro...

王陆宽 2019-08-23 11:25 评论0 收藏0
JavaScript中的面向对象（object-oriented）编程

摘要：对象在中，除了数字字符串布尔值这几个简单类型外，其他的都是对象。那么在函数对象中，这两个属性的有什么区别呢表示该函数对象的原型表示使用来执行该函数时这种函数一般成为构造函数，后面会讲解，新创建的对象的原型。这时的函数通常称为构造函数。。本文原发于我的个人博客，经多次修改后发到sf上。本文仍在不断修改中，最新版请访问个人博客。最近工作一直在用nodejs做开发，有了nodejs，...

JerryZou 2019-08-21 10:26 评论0 收藏0