JavaScript的Object类型和Array类型
Object类型.
创建object实例的方法有两种。第一种就是使用new操作符和object来构造函数，例如：
var person = new Object();
person.name = "xuxiaotong";
person.sex = "male";
person.age = 21;
另一种就是使用字面量表示法：
var student = {
name : "xutong",
age : 22,
id : "04171004"
}
访问对象属性的时候一般都是用点表示法例如：
var student = {
name : "xutong",
age : 22,
id : "04171004"
}
console.log(student.age);//输出：22
在JavaScript也可以使用方括号的表示法来访问对象属性：
var student = {
name : "xutong",
age : 22,
id : "04171004"
}
console.log(student.age); //输出：22
console.log(student["age"]); //输出：22
功能上两种方法没有区别，但是方括号语法的优点就是可以使用变量来访问属性：
var student = {
name : "xutong",
age : 22,
id : "04171004"
}
var myage = "age";
console.log(student[myage]); //输出22
console.log(student["age"]); //输出22
Array类型
创建数组的方法有两种：
第一种就是只用Array构造数组：
var arr1 = new Array();
var arr2 = new Array(10);
console.log(arr2.length); //10
var arr3 = new Array("red","blue","green");
console.log(arr3[1]); //blue
而且，可以省略new操作符。
第二种方法就是数组字面量表示法：
var arr1 = ["red","blue","green"];
var arr2 = []; //创建一个空数组
console.log(arr1[1]); //blue
对数组值的读取和设置：
var arr = ["red","blue","green"];
console.log(arr.toString()); //red,blue,green
console.log(arr[1]); //blue
arr[3] = "yellow"; //新增项
console.log(arr.length); //4
数组的length并不是只读的，可以通过设置它来改变数组值：
var arr = ["red","blue","green"];
arr.length = 2;
console.log(arr[2]); //undefined
arr.length = 5;
console.log(arr[4]); //undefined
var arr = ["red","blue","green"];
console.log(arr); //[ 'red', 'blue', 'green' ]
arr[arr.length] = "black";
console.log(arr); //[ 'red', 'blue', 'green', 'black' ]
长度值length等于最后一项的索引+1；
1.数组检测
var arr = ["red","blue","green"];
console.log(Array.isArray(arr)); //true
2.数组的转换方法
var arr = ["red","blue","green"];
console.log(arr.valueOf()); //[ 'red', 'blue', 'green' ]
console.log(arr.toString()); //red,blue,green
console.log(arr.toLocaleString()); //red,blue,green
console.log(arr); //[ 'red', 'blue', 'green' ]
需要注意的是：toLocaleString()方法调用的是每一项的toLocaleString()方法而不是toString()方法。
3.栈方法
push()方法可以接受任意数量的参数，把他们逐个添加到数组末尾，并返回数组长度。
pop()方法则是从数组末尾移除最后一项，返回移除的项。
举例：
var arr = [];
var count = arr.push("red","blue","green");
console.log(count); //3
console.log(arr.toString()); //red,blue,green
var item = arr.pop();
console.log(arr.length); //2
console.log(item); //green
console.log(arr.toString()); //red,blue
队列方法
栈数据访问规则是后进先出，
而队列数据的访问规则是先进先出。
先介绍一个新的方法：
shift():它能将数组中第一项移除并返回该项，同时数组的长度减1。
var arr = [];
var count = arr.push("red","blue","green");
console.log(count); //3
console.log(arr.toString()); //red,blue,green
var item = arr.shift();
console.log(arr.length); //2
console.log(item); //red
console.log(arr.toString()); //blue,green
此外，ECMAScript还为数组提供了一个
unshift()方法：与shift()方法相反，他能在数组的前端添加任意个项并返回新长度。
var arr = [];
var count = arr.push("red","blue","green");
console.log(count); //3
console.log(arr.toString()); //red,blue,green
var item = arr.unshift("black");
console.log(arr.length); //4
console.log(item); //4
console.log(arr.toString()); //black,red,blue,green
unshift()和pop()方法同时使用可反方向模拟队列。
重排序方法
数组中可以直接使用的重排序方法：reverse()和sort();
reverse():翻转数组项的顺序。
var arr = [];
var count = arr.push("red","blue","green");
arr.reverse();
console.log(arr.toString()); //green,blue,red
sort()方法默认情况下，按照圣墟排列数组项。该方法会调用每个数组项的toString()转型方法，比较得到的字符串。
var arr = [];
var count = arr.push(1,12,10,3,5);
arr.sort();
console.log(arr.toString()); //1,10,12,3,5
显然，这种排序方法在很多情况下都不是最佳方案，因此sort()方法可以接受一个比较函数来指定排序方法。
比值函数：
接收两个参数，
如果第一个参数位于第二个参数之前，返回负数；
如果两个参数相等，返回0；
如果第一个参数位于第二个参数之后，返回正数；
举例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>test1</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="">
<script src="vue.js"></script>
</head>
<body>
<div id = "app">
<button @click = click1>按字母排序</button>
<button @click = click2>按数字排序</button>
<p>{{message}}</p>
</div>
<script>
var point = [40,100,1,5,25,10];
var vm = new Vue({
el: "#app",
data:{
message:point.toString()
},
methods:{
click1:function(){
this.message = point.sort().toString();
},
click2:function(){
this.message = point.sort(function(a, b){return a - b}).toString();
}
}
})
</script>
</body>
</html>
渲染结果：
操作方法
ECMAScript为操作已经包含在数组的项提供了很多方法。
concat()基于原先数组创建一个新的数组。其参数会被添加到接轨数组的尾部。
var arr = [1, 3, 5];
var arr1 = arr.concat (1,2,[5,6,7]);
console.log(arr); //[ 1, 3, 5 ]
console.log(arr1); //[1, 3, 5, 1,2, 5, 6, 7]
下一个方法是slice()，基于当前数组创建一个新数组。
当该方法只有一个参数时，该方法但会从参数指定位置的到结束为止所有的项。
当该方法有两个参数时，将返回起始和结束之间的项（但是不包括结束位置的项）。
var arr = [1,2,3,4,5];
console.log(arr.slice(2,4)); //[ 3, 4 ]
console.log(arr.slice(2)); //[ 3, 4, 5 ]
下一个我们介绍splice()函数这个方法在数组里面可以说的上是非常强大了。
删除功能：包含两个参数：删除第一项的位置和要删除的项数。并返回删除的项。
var arr = [1,2,3,4,5];
console.log(arr.splice(2,2)); //[ 3, 4 ]
console.log(arr); //[ 1, 2, 5 ]
插入功能：三个参数：起始位置，0，要插入的项。
var arr = [1,2,3];
console.log(arr.splice(2,0,8,9)); //[]
console.log(arr); //[ 1, 2, 8, 9, 3 ]
位置方法
很简单，直接举例，你绝对可以看懂。
var arr = [5,6,8,1,3,4,8];
console.log(arr.indexOf(8))
console.log(arr.lastIndexOf(8))
迭代方法
var arr = [5,6,8,1,3,4,8];
console.log(arr.every(function(item){
return (item>2)
}))
console.log(arr.some(function(item){
return (item>2)
}))
console.log(arr.filter(function(item){
return (item>2)
}))
console.log(arr.map(item => item*2
))
缩小方法
reduce()和reduceRigh(）主要取决于从什么方向飞遍历。
var arr = [5,6,8,1,3,4,8];
console.log(arr.reduce((pre,cur) => pre+cur))
扫一扫
2928
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
