js-引用类型-Array
1.数组的操作方法
<html>
<meta http-equiv="content-type" charset="utf-8" />
<title>操作数组的方法，记得跟python类比</title> <script type="text/javascript">
var shuzu=new Array("eric","alis","django","tornado");
//数组的合并方法，concat()
console.log("数组的合并方法");
//三种不同的数组转换成字符串的方式
console.log(shuzu.concat("liuhuan",[2,3,"jim"]).toString());
console.log(shuzu.concat("liuhuan",[2,3,"jim"]).toLocaleString());
console.log(shuzu.concat("liuhuan",[2,3,"jim"].valueOf()));
//数组的切片方法,跟python一样顾前不顾后
console.log("=======================");
console.log(shuzu.slice(2,3));
//数组的最强大的方法splice方法，主要用途是向数组的中部插入项；有返回值，是一个数组（删除的项组成）*****
//1.删除
console.log("splice,js数组中的超级方法，基友删除和添加，替换的功能");
var spliceDemo=["eric","宋佳",2,3,3,4];
var delArray=spliceDemo.splice(0,2);
console.log(delArray.toString());
console.log(spliceDemo);
console.log("替换");
var delArray2=spliceDemo.splice(0,0,"lizbeo","liuhuan");
console.log(delArray2);
console.log(spliceDemo);
console.log("插入,并删除");
var delArray3=spliceDemo.splice(0,2,"lizbeo222",2222);
console.log(delArray3);
console.log(spliceDemo);
</script>
<body>
<h1>操作数组的方法</h1>
</body>
</html>
2.迭代方法
<html>
<head>
<meta http-equiv="content-type" charset="utf-8">
<title>迭代方法</title>
<script type="text/javascript">
//ECMAScript为数组定义了5个迭代方法。每个方法都接收2个参数：要在每一项运行的函数（可选）和运行该函数的作用域对象
//影响this的值。传入这些方法中的函数会接收三个参数：数组项的值，该项在数组中的位置和数组对象本身。根据使用方法的不同，这个函数
//执行后的返回值可能会也可能不会影响方法的返回值。
/*evary()*/
var shuzu=[1,2,3,4,5,4,3,2,1]; var evaryResult=shuzu.every(function(item,index,array){
return item>2;
});//结果是flase,因为every顾名思义就是数组中的每个值都要大于2才能得到true结果。
console.log(evaryResult);
/*some()*/
var someResult=shuzu.some(function(sb,index,array){
return sb>2;
});
console.log(someResult);
/*filter()监听，监听符合条件的数组并返回数组*/
var filterResult=shuzu.filter(function(item,sf,jfsklfs){
return item>2;
});
console.log(filterResult);
/*map();对每一项进行操作，返回每一项操作后的数组*/
var mapResult=shuzu.map(function(mapDemo,sb,sjflasjfaslkjflas){
return mapDemo**2;
});
console.log(mapResult);
//forEach();方法，相当于for迭代遍历数组
console.log("=====================");
for(var i;i<=shuzu.length;i++){
window.alert(shuzu[i]);
}; </script>
</head>
<body>
<h1>迭代方法</h1>
<h2>其中map是真的有用这种方法，js数组的map方法可以对每一项进行相同的操作，这是多么叼，最关键的是代码很少。</h2>
</body>
</html>
3.归并方法(从前往后迭代和从后往前迭代)
<!DOCTYPE>
<html>
<head>
<meta http-equiv="content-type" charset="utf-8">
<title>归并方法</title>
<script type="text/javascript">
var shuzu=new Array();
shuzu=[1,2,3,4,5,6];
//求数组中的每一项的和使用reduce();
var sum=shuzu.reduce(function(pre,cur,index,arry3){
return pre+cur;
});
console.log(sum);
//使用reduceRight()求数组中的所有项的积;
var su1=shuzu.reduceRight(function(pre,cur,index,arry33){
return pre*cur;
});
console.log(su1); var su3=shuzu.reduce(function(pre,cur,index,sjfsl){
return pre*cur;
});
console.log(su3);
</script>
</head>
<body>
<h1>归并方法</h1>
<h2>这两个方法都接收两个参数：一个在每一项上调用的函数和（可选的）作为归并基础的初始值。传给reduce()和reduceRight()的函数接收4个参数</h2>
<h2>前一个值，当前值，项的索引和数组对象。这个函数返回的任何值都会作为第一个参数传给下一项。第一次迭代发生在数组的第二项
，因此第一个参数是数组的第一项，第二个参数是数组的第二项。</h2> </body>
</html>
4.检测数组
<!DOCTYPE>
<html>
<head>
<meta http-equiv="content-type" charset="utf-8" />
<script type="text/javascript">
/*Javascript中的数组是1.可以存储任意类型 2.动态调整。*/
//创建方式一：使用array的构造函数：
var arrryDemo1=new Array();
var arrayDemo2=new Array(3);//创建一个包含3项的数组
var arrayDemo3=new Array("alex");//创建一个包含一项的数组
console.log(arrayDemo2.length);
console.log(arrayDemo3[0]);
//创建方式二：使用字面量进行创造
var color=["red","blue",234,2.34];
console.log(color.length);
console.log(color[3]);
console.log("length属性不只是可读，还可以进行赋值");
color.length=5;
console.log(color[4]);//undefinend
console.log("移除最后一项");
color.length=3;
console.log(color[3]);//undefinend //检测数组
var checkArray=new Array("李泽博","liuhuan",23424);
if(checkArray instanceof Array){
console.log("这是数组类型，数组类型是一个内置引用对象，所以我们使用检测方式的时候，使用的是instanceof");
} </script>
<style type="text/css"> </style>
</head>
<body>
<h1>你好，Javascript</h1>
</body>
</html>
5.位置方法
<html>
<head>
<meta http-equiv="content-type" charset="utf-8" >
<title>位置方法</title> <script type="text/javascript">
console.log("位置方法");
var indexDemo=new Array();
indexDemo.push("eric","宋佳","李逵");
console.log(indexDemo.indexOf("eric"));
//要查找的项是“李逵”，查找的位置索引是1.
console.log(indexDemo.lastIndexOf("李逵",2));
</script>
</head>
<body>
<h1>位置方法</h1>
<h3>这2个方法都接收2个参数，一个是要查找的项和（可选的）表示查找起点位置的索引。其中
indexOf()方法从数组的开始进行查找，而lastIndexOf()是从结尾开始查找。如果没有，返回-1
</h3>
</body>
</html>
6.重排序
<html>
<head>
<meta http-equiv="content-type" charset="utf-8" />
<title>重新排序</title> <script type="text/javascript">
var arrayDemo=[1,2,3,4,5];
//reverse()
console.log(arrayDemo.reverse());
//sort();
console.log(arrayDemo.sort());//但是sort是以第一个字母进行的排序
</script>
</head>
<body>
<h1>reverse，sort</h1>
</body>
</html>
7.转换方法
<!DOCTYPE>
<html>
<head>
<title>转换方法，也就是数组转换成，字符串，因为alert，console可以自动转换成字符串</title>
<meta http-equiv="content-type" charset="utf-8">
<script type="text/javascript">
/*转换方法：*/
var shuzu=["eric","hahah ","刘欢"];
console.log(shuzu.toString());
console.log(shuzu.toLocaleString());
console.log(shuzu.valueOf());//返回的是对象
alert(shuzu.valueOf());//返回字符串 //join方法
shuzu.join("||");
console.log(shuzu);
alert(shuzu);
</script>
</head>
<body>
</body>
</html
8.FIFO
<html>
<head>
<title>先进先出</title>
<meta http-equiv="content-type" charset="utf-8" / > <script type="text/javascript">
console.log("先进先出");
var color=new Array();
var count=color.push("eric","bob","刘欢");
console.log("pushi之后数组的长度是:");
console.log(count);
console.log("取出来第一个值");
console.log(color.shift());
var count1=color.unshift("pop","shift","unshift");
console.log("使用unshift进行队列压值");
console.log(color.shift());//pop
console.log(color.pop());//刘欢 </script>
</head>
<body>
<h1>先进先出</h1>
<h2>后压前取，前压后取</h2>
</body>
<script type="text/javascript">
/*后压前取*/
var shuzu=new Array();
var count=shuzu.push("刘备","张飞","关羽");
console.log("===============");
console.log(shuzu.shift());
console.log(shuzu.pop());
/*前压后取*/
var shuzu2=new Array();
var count2=shuzu2.unshift("诸葛亮","宋江","鲁智深");
console.log("====================");
console.log(count2);
console.log(shuzu2.pop());
</script>
</html>
9.LIFO
<html>
<head>
<title>后进先出</title>
<meta http-equiv="content-type" charset="utf-8" />
<script type="text/javascript">
var color=new Array();
//压进入，后进先出。注意这个函数是有返回值的，返回的是新数组的长度。
var count=color.push("red","yellow","black");
console.log("函数的返回值是:");
console.log(count);
alert(color.length);
alert(color.pop());
</script>
</head>
<body>
<h1>后进先出</h1>
</body>
</html>
js-引用类型-Array的更多相关文章
- 从一个简单例子来理解js引用类型指针的工作方式
<script> var a = {n:1}; var b = a; a.x = a = {n:2}; console.log(a.x);// --> undefined conso ...
- JavaScript基础18——js的Array对象
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- JS对Array进行自定制排序
JS对Array进行自定制排序,简单的做一个记录,代码如下所示: //Test function function myFunction(){ var myArr = new Array(); var ...
- 多动手试试，其实List类型的变量在页面上取到的值可以直接赋值给一个js的Array数组变量
多动手试试,其实List类型的变量在页面上取到的值可以直接赋值给一个js的Array数组变量,并且数组变量可以直接取到每一个元素var array1 = '<%=yearList =>'; ...
- JS中Array数组的三大属性用法
原文:JS中Array数组的三大属性用法 Array数组主要有3大属性,它们分别是length属性.prototype属性和constructor属性. JS操作Array数组的方法及属性 本文总结了 ...
- JS数组array常用方法
JS数组array常用方法 1.检测数组 1)检测对象是否为数组,使用instanceof 操作符 if(value instanceof Array) { //对数组执行某些操作 } 2)获取对象的 ...
- js 在array的遍历操作中修改arry中元素数量 出现的一些奇特的操作
在js中array是属于复杂类型,在arr1=arr2得赋值操作中,arr1得到的值并不是arr2的value,而是一个指向引用.那么修改arr1的同时arr2读取的值也会同步变化,那么问题来了,上代 ...
- 斗篷指令、属性指令、表单指令、条件指令、循环指令、js的Array操作、前台数据库、
```python"""1)指令 属性指令:v-bind 表达指令:v-model 条件指令:v-show v-if 循环指令:v-for 斗篷指令:v-cloak 2) ...
- js create Array ways All In One
js create Array ways All In One ES6 const arr = [...document.querySelectorAll(`[data-dom="^div& ...
- js swap array
js swap array ES6 swap array 就地交换 no need let , const [ b, a, ] = [ a, b, ]; // ES6 swap const arr = ...
随机推荐
- APP崩溃提示：This application is modifying the autolayout engine from a background thread after the engine was accessed from the main thread. This can lead to engine corruption and weird crashes.
崩溃输出日志 2017-08-29 14:53:47.332368+0800 HuiDaiKe[2373:1135604] This application is modifying the auto ...
- 【NOIP模拟】jzoj5233概率博弈（树规）
Description 小A和小B在玩游戏.这个游戏是这样的: 有一棵
- javascript 之基本包装类型--04
基本包装类型 基本包装类型是特殊的引用类型.每当读取一个基本类型值的时候,后台就会创建一个对应的基本包装类型的对象,从而可以调用属性.方法来进行后续操作. ECMAScript还提供了三种基本包装类型 ...
- RabbitMQ 笔记-基本概念
ConnectionFactory.Connection.Channel ConnectionFactory.Connection.Channel,这三个都是RabbitMQ对外提供的API中最基本的 ...
- FastDFS与Nginx的配置说明
1.简介 FastDFS是一个开源的轻量级分布式文件系统,它对文件进行管理,功能包括:文件存储.文件同步.文件访问(文件上传.文件下载)等,解决了大容量存储和负载均衡的问题.特别适合以文件为载 ...
- 微信小程序图片放大预览
需求:当点击图片时,当前图片放大预览,且可以左右滑动 实现方式:使用微信小程序图片预览接口 我们可以看到api需要两个参数,分别通过下面的data-list和data-src来传到js中 wxml代码 ...
- 用BroadcastReceiver监听手机网络状态变化
android--解决方案--用BroadcastReceiver监听手机网络状态变化 标签: android网络状态监听方案 2015-01-20 15:23 1294人阅读 评论(3) 收藏 举报 ...
- Codeforces Round #203 (Div. 2)B Resort
Resort Time Limit:2000MS Memory Limit:262144KB 64bit IO Format:%I64d & %I64u Submit Stat ...
- Tomcat请求头过大
今天开发反应Tomcat的请求头过大 <Connector port="8280" protocol="HTTP/1.1" connectionTimeo ...
- linq中怎么实现多条件关联的左右连接
linq左右连接最重要的是DefaultIfEmpty()这个方法和join之后的表中判断是否( temp != null)null,左右连接其实就是表的位置互换. 1.左连接: && ...