Javascript之高级数组API的使用实例
JS代码中我们可以根据需求新建新的对象解决问题的同时,也有一些常用的内置对象供我们使用,我们称之为API,本篇文章只是对数组部分进行了练习。
例一:伪数组,不能修改长短的数组(所以没办法清零),可以修改元素,代码实现如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<script> fn(1,2); fn(1,2,3,4,5,6); fn(1,2,4,5,7,9,4); function fn(a,b){ arguments[0]=0; console.log(arguments); arguments.push(1); console.log(arguments instanceof Array); console.log(arguments.length); //实参个数 console.log(fn.length); //形参个数 console.log(arguments.callee); //整个函数,包括注释 } </script> |
伪数组打印的是实参,而普通函数调用打印的是形参,并且打印它的函数类型,我们发现它的类型显示并不是数组。
例二:将一个字符串数组输出为|分割的形式,比如“刘备|张飞|关羽”。使用两种方式实现
方法一:不利用内置对象,进行字符串拼接,由于第一个元素前没有特殊符号,首先将其赋值后,循环从下一个元素开始遍历
1
2
3
4
5
6
7
8
|
<script> var arr=[ "刘备" , "张飞" , "关羽" ]; var str=arr[0]; for ( var i=1;i<arr.length;i++){ str+= "|" +arr[i]; } console.log(str); </script> |
方法二:使用内置对象直接改变间隔符号
1
2
3
4
5
|
<script> var arr=[ "刘备" , "张飞" , "关羽" ]; var str=arr.join( "|" ); console.log(str); </script> |
两种方法进行对比,我们发现第一种方法使之产生了大量内存,导致内存浪费情况,从此看出对我们来说内置对象的使用帮我们解决了内存浪费的缺点。
例三:将一个字符串数组的元素的顺序进行反转。["a","b","c","d"] ->["d","c","b","a"]。使用两种种方式实现。
方法一:之前文章介绍过的方法
1
2
3
4
5
6
7
8
|
<script> var str1=[ "a" , "b" , "c" , "d" ]; var str2=[]; for ( var i=0;i<str1.length;i++){ str2[str1.length-i-1]=str1[i]; } console.log(str2); </script> |
方法二:直接使用内置对象reverse()
解决
1
2
3
4
|
<script> var str1=[ "a" , "b" , "c" , "d" ]; console.log(str1.reverse()); </script> |
例四:工资的数组[1500,1200,2000,2100,1800],把工资超过2000的删除
使用内置对象filter()
实现题目需求。
1
2
3
4
5
6
7
8
9
10
|
<script> var arr=[1500,1200,2000,2100,1800]; var arr1=arr.filter( function (element,index,array){ if (element<=2000){ return true ; } return false ; }) console.log(arr1); </script> |
例五:["c","a","z","a","x","a"]找到数组中每一个元素出现的次数
由于题目给出字符形式,让我们求出的相应字符的个数为数字形式,这让我们应用json更方便问题解决,将题目给出的字符作为“键”,将次数作为“键值”,来判断数组中的元素,在json中是否存在属性值,如果存在,在原有基础上加上1;如果不存在直接赋值为1。
1
2
3
4
5
6
7
8
9
10
11
12
|
<script> var arr=[ "c" , "a" , "z" , "a" , "x" , "a" ]; var json={}; for ( var i=0;i<arr.length;i++){ if (json[arr[i]]!==undefined){ json[arr[i]]+=1; } else { json[arr[i]]=1; } } console.log(json); </script> |
例六:编写一个方法 去掉一个数组的重复元素
方法一:新建数组,将原数组第一个元素push进入新数组。遍历原数组的每一个元素使之在新数组每一个元素中都不存在(嵌套两层for循环),就push进入原数组,否则就跳出新数组循环,进入原数组的下一个元素循环。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<script> var arr=[3,2,4,5,5,3,5,568,4,21,7]; var arr1=fn(arr); function fn(array){ var arr2=[]; arr2.push(array[0]); abc: for ( var i=0;i<array.length;i++){ for ( var j=0;j<arr2.length;j++){ if (arr2[j]==array[i]){ continue abc; } } arr2.push(array[i]); } return arr2; } console.log(arr1); </script> |
方法二:创建一个新数组,循环遍历,只要新数组中有旧数组的值,就不要在添加。每次都要判断新数组中是否有旧数组的值,保证旧数组的元素和新数组中每一个都不相等,则赋值给新数组的下一元素的值。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<script> var arr=[1,2,3,4,5,2,3,4]; console.log(arr); console.log(fn(arr)); function fn(array){ var newArr=[]; for ( var i=0;i<array.length;i++){ var bool= true ; for ( var j=0;j<newArr.length;j++){ if (array[i]===newArr[j]){ bool= false ; } } if (bool){ newArr[newArr.length]=array[i]; } } return newArr; } </script> |
Javascript之高级数组API的使用实例的更多相关文章
- JavaScript中对数组和数组API的认识
JavaScript中对数组和数组API的认识 一.数组概念: 数组是JavaScript中的一类特殊的对象,用一对中括号“[]”表示,用来在单个的变量中存储多个值.在数组中,每个值都有一个对应的不重 ...
- JavaScript——引用类型之数组
前言 之前本菜打算在写完基本类型后写引用类型Object的,因为Object是引用类型的基础,其他的引用类型也是以Object为根本.只是关于对象的基本认识与简单操作确实可写的不多,打算之后与原型.原 ...
- 主要看思路:区域数据去重 + JavaScript一次性展示几万条数据实例代码
近期做1功能,Gis地图 基于百度地图api , 会遇到的问题的, 如后台接口给的数据很多,大几千上万的,如果拿了数据直接渲染dom ,这滋味爽爽的. 再遇上 客户端浏览器悲催的,这卡顿就来了... ...
- JavaScript中的数组创建
JavaScript中的数组创建 数组是一个包含了对象或原始类型的有序集合.很难想象一个不使用数组的程序会是什么样. 以下是几种操作数组的方式: 初始化数组并设置初始值 通过索引访问数组元素 添加新元 ...
- javascript中关于数组的一些鄙视题
一.判断一个数组中是否有相同的元素 /* * 判断数组中是否有相同的元素的代码 */ // 方案一 function isRepeat1(arrs) { if(arrs.length > 0) ...
- Javascript中判断数组的正确姿势
在 Javascript 中,如何判断一个变量是否是数组? 最好的方式是用 ES5 提供的 Array.isArray() 方法(毕竟原生的才是最屌的): var a = [0, 1, 2]; con ...
- 第一百零三节,JavaScript对象和数组
JavaScript对象和数组 学习要点: 1.Object类型 2.Array类型 3.对象中的方法 什么是对象,其实就是一种类型,即引用类型.而对象的值就是引用类型的实例.在ECMAScript中 ...
- Python学习之高级数组(一)
1.Python基础学习之高级数组(一) 1.1视图:就是与较大数组共享相同数据的较小数组.Numpy包提供数据视图的概念是为了精确地控制内存的使用方式. 数组视图.切片视图.转置和重塑视图等 数组 ...
- 【repost】Javascript操作DOM常用API总结
Javascript操作DOM常用API总结 文本整理了javascript操作DOM的一些常用的api,根据其作用整理成为创建,修改,查询等多种类型的api,主要用于复习基础知识,加深对原生js的认 ...
随机推荐
- [Android]自己动手做个拼图游戏
目标 在做这个游戏之前,我们先定一些小目标列出来,一个一个的解决,这样,一个小游戏就不知不觉的完成啦.我们的目标如下: 游戏全屏,将图片拉伸成屏幕大小,并将其切成若干块. 将拼图块随机打乱,并保证其能 ...
- python接口自动化(二十三)--unittest断言——上(详解)
简介 在测试用例中,执行完测试用例后,最后一步是判断测试结果是 pass 还是 fail,自动化测试脚本里面一般把这种生成测试结果的方法称为断言(assert).用 unittest 组件测试用例的时 ...
- SpringCloud学习系列之五-----配置中心(Config)和消息总线(Bus)完美使用版
前言 在上篇中介绍了SpringCloud Config的使用,本篇则介绍基于SpringCloud(基于SpringBoot2.x,.SpringCloud Finchley版)中的分布式配置中心( ...
- .net core 杂记:日记记录
ASP.NET Core 有内置的log组件,遗憾的是看了微软官方文档,貌似无法直接将日志存于文件或数据库,只能由自己实现或引用第三方日志组件. 以下为Nlog和log4net的使用记录 Nlog使用 ...
- Android版数据结构与算法(八):二叉排序树
本文目录 前两篇文章我们学习了一些树的基本概念以及常用操作,本篇我们了解一下二叉树的一种特殊形式:二叉排序树(Binary Sort Tree),又称二叉查找树(Binary Search Tree) ...
- Android版数据结构与算法(七):赫夫曼树
版权声明:本文出自汪磊的博客,未经作者允许禁止转载. 近期忙着新版本的开发,此外正在回顾C语言,大部分时间没放在数据结构与算法的整理上,所以更新有点慢了,不过既然写了就肯定尽力将这部分完全整理好分享出 ...
- asp.net Core 中AuthorizationHandler 实现自定义授权
前言 ASP.NET Core 中 继承的是AuthorizationHandler ,而ASP.NET Framework 中继承的是AuthorizeAttribute. 它们都是用过重写里面的方 ...
- Java面向接口编程,低耦合高内聚的设计哲学
接口体现的是一种规范和实现分离的设计哲学,充分利用接口可以极大的降低程序中各个模块之间的耦合,提高系统的可维护性以及可扩展性. 因此,很多的软件架构设计理念都倡导"面向接口编程"而 ...
- SharePoint布局页创建(实战)
分享人:广州华软 极简 一. 前言 SharePoint有母版页及布局页,母版页控制页面头部.底部,而布局页则控制页面中间内容区域.通过布局页,可以快速修改页面内容区域. SharePoint的页面布 ...
- Oracle数据库升级注意事项
1 备份配置参数 数据库升级前的配置参数要备份,如PGA大小 这样数据库升级后还可以升级前的配置,而不至于使用安装升级时的默认配置 2 检查版本兼容 确认数据库升级后是否对生产环境上的代码有影响,如果 ...