复习:
1、函数的内部属性
只有在函数内部才能访问的属性
1. 形参
a -> 1
b -> 2
2. arguments (类数组对象)
函数接受的所有参数真正存储的地方
1,2,3,4,5
3. this
this指向与函数的调用方式有关
函数名(实参);
函数名.call(实参列表);
函数名.apply(实参数组);
结论:
1. 函数如果使用的是()调用,那就看一下()前面的变量是不是一个函数,如果是,再看函数名前面有没有对象
如果有对象,this指向该对象
如果没有对象
nodejs this指向global全局对象
浏览器 this指向window对象
2. 如果函数使用call、apply调用,this指向用户手动指向的对象
var pig = {
words:'哼哼',
sound:function(){
console.log(this.words)
}
}
var dog = {
words:'汪汪'
}
pig.sound(); // 哼哼
pig.sound.call(dog); // 汪汪
function sayName(a,b){
console.log(this);
console.log(arguments);
return a + b;
}
var result = sayName(1,2,3,4,5);
console.log(result);
2、闭包
函数中包含另一个函数
function fn1(){
var name = 'xpf';
console.log(age);
function fn2(){
var age = 25;
console.log(name);
}
fn2();
}
fn1();
3、立即执行函数、匿名函数
(function(a,b){
console.log(a+b); // 3
})(1,2);
4、数组
1. 特点
1) 以[]为边界
2) 数组的组成称为元素/项
3) 元素与元素之间通过逗号分割
4) 元素的数据类型没有限制
2. 定义方式
1) 数组字面量
var arr1 = [];
var arr2 = [1,2,3];
arr2[arr2.length] = [4];
2) Array构造函数
var arr3 = new Array();
注意:
如果传递的是一个数字,会按照这个数字创建给定项数的数组
var arr4 = new Array(3);
=>
[,,,]
3. 数组的访问
数组名[索引]
索引从0开始
var arr = [1,2,3];
console.log(arr[1]); // 2
注意:
如果指定索引上的位置没有元素,返回undefined
4. 数组的属性
length
var arr = [1,2,3];
console.log(arr.length); // 3
学习
5. 数组的遍历
1) for循环
2) while循环
3) do-while循环
var arr = ['hello','world','xpf'];
//将数组的长度赋值给length变量
var length = arr.length;
for(var i=0;i<length;i++){
//i是当前遍历数组的索引
console.log(i);
//arr[i]就是当前遍历数组的每一项
console.log(arr[i],'---');
}
4) for-in 增强for循环
var arr = ['hello','world','xpf'];
for(var key in arr){
//key是当前遍历数组的索引
console.log(key);
//arr[key]就是当前遍历数组的每一项
console.log(arr[key]);
}
6. 判断是否数组
Array.isArray()
var arr = [1,2,3,4];
var obj = {
name:'xpf',
age:25,
gender:'male'
}
console.log(Array.isArray(arr)); // true
console.log(Array.isArray(obj)); // false
拓展:
instanceof 引用数据类型
判断某一个变量是否某一个构造函数的实例
typeof 基本数据类型
var arr = [1,2,3,4];
console.log(arr instanceof Array); // true
console.log(arr instanceof Object); // true
原型链
爷爷奶奶 Object构造函数
父母 Array构造函数、原型
你 arr实例
7. 数组API
数组构造函数原型中的方法,即数组实例都可以调用
Array.prototype.push()
Array.prototype.pop()
Array.prototype.shift()
Array.prototype...
api
含义;参数;返回值
1) 添加元素、删除元素相关 【改变了原数组】
push()
含义:在数组的最后添加元素
参数:要添加的元素
返回值:返回新增了元素之后的数组的长度
添加一个元素
var arr = [1,2,3];
var name = 'xpf';
var result = arr.push(name);
console.log(arr); // [1,2,3,'xpf']
console.log(result); // 4
添加多个元素
var arr = [1,2,3];
var name = 'xpf';
var age = 25;
var gender = 'male';
var result = arr.push(name,age,gender);
console.log(arr); // [ 1, 2, 3, 'xpf', 25, 'male' ]
console.log(result); // 6
pop()
含义:从数组的最后取出一个元素
参数:无
返回值:返回被删除的元素
var arr = [1,2,3,4,'zhangsan'];
var result = arr.pop();
console.log(arr); // [1,2,3,4]
console.log(result); // zhangsan
注意:就算在pop()的小括号里面加了参数,也没效果
var arr = [1,2,3,4,'xpf'];
arr.pop();
arr.pop();
arr.pop();
console.log(arr); // [1,2]
shift()
含义:将数组中第一个元素删除
参数:无
返回值:被删除的元素
var arr = ['hello','world','xpf','tom'];
var result = arr.shift();
console.log(arr); // [ 'world', 'xpf', 'tom' ]
console.log(result); // hello
unshift()
含义:将元素添加到数组的最前面
参数:要新增的元素
返回值:新增了元素之后的新数组的长度
var arr = ['hello','world','xpf','tom'];
var age = 25;
var gender = 'male';
var result = arr.unshift(age,gender);
console.log(arr); // [25,'male','hello','world','xpf','tom']
console.log(result); // 6
2) 排序方法 【改变原数组】
sort()
var arr = [3,2,4,1,6];
console.log(arr.sort()); // [1,2,3,4,6]
买家秀和卖家秀
需要对一下数组进行排序,从小到大
排序前:var arr = [3,2,1,12,21];
排序后:arr = [1,2,3,12,21];
代码一:
var arr = [3,2,1,12,21];
var result = arr.sort();
console.log(result); // [ 1, 12, 2, 21, 3 ]
代码二:
使用比较器函数
arr.sort(比较器函数)
比较器函数也称为匿名函数,可以接两个参数a,b
当a>b时返回1,从小到大排序
当a<b时返回-1,从大到小排序
var arr = [3,2,1,12,21];
var result = arr.sort(function(a,b){
if(a>b){
return 1;
} else {
return -1;
}
});
console.log(result); // [1,2,3,12,21]
3) 数组序列化 【不改变原数组】
如何将一个数组转换为字符串?
var arr = [1,2,3,4]
->
1,2,3,4
1. toString()
含义:将数组转换为字符串,数组中的元素通过逗号连接
参数:无
返回值:转换后的字符串
var arr = [1,2,3,4];
var result = arr.toString();
console.log(arr,'arr'); // [1,2,3,4]
console.log(result); // 1,2,3,4
console.log(typeof(result)); // string
2. join()
含义:将数组转换为字符串
参数:可有可无
返回值:转换后的字符串
var arr = [1,2,3,4];
->
1234
1 2 3 4
1-2-3-4
1+2+3+4
var arr = [1,2,3,4];
var result1 = arr.join();
var result2 = arr.join('');
var result3 = arr.join(' ');
var result4 = arr.join('-');
var result5 = arr.join('*');
console.log(arr); // [1,2,3,4]
console.log(result1); // 1,2,3,4
console.log(result2); // 1234
console.log(result3); // 1 2 3 4
console.log(result4); // 1-2-3-4
console.log(result5); // 1*2*3*4
3. JSON.stringify()
含义:将数组转换为json字符串
参数:需要转换的数组
返回值:转换后的json字符串
var arr = [1,2,3,4,5];
var result = JSON.stringify(arr);
console.log(arr); // [1,2,3,4,5]
console.log(Array.isArray(arr)); // true
console.log(result); // '[1,2,3,4,5]'
console.log(typeof(result)); // string
4) 数组截取方法
1. concat() 【不改变原数组】
含义:将参数中的数组和使用该方法得数组合并为一个数组
参数:一个或多个数组
返回值:合并后的数组
var arr1 = [1,2,3];
var arr2 = arr1.concat([4,5,6]);
var arr3 = arr1.concat(['hello','world'],['xpf','tom']);
console.log(arr1); // [1,2,3]
console.log(arr2); // [1,2,3,4,5,6]
console.log(arr3); // [1,2,3,'hello','world','xpf','tom']
2. slice() 【不改变原数组】
含义:从使用了改方法的数组中截取一个子数组
参数:一个或者两个数字
返回值:返回截取到的子数组
一个参数:
var arr1 = [1,2,3,4,5];
var arr2 = arr1.slice(2);
var arr3 = arr1.slice(5);
console.log(arr1); // [1,2,3,4,5]
console.log(arr2); // [3,4,5]
console.log(arr3); // []
如果只传递了一个参数,截取到的就是索引从该位置开始之后所有的项,做为新数组,如果该值超过了原数组的最大索引,返回的将是一个空数组
两个参数:
slice(a,b)
a -> 起始位置
b -> 结束位置
如果传递的是两个参数,截取子数组的时候,包含起始位置,不包含结束位置
var arr1 = [1,2,3,4,5];
var arr4 = arr1.slice(2,3);
console.log(arr4); // [3]
三个或者多个参数:
多余的参数没有效果
3. splice() 【改变原数组的值】
含义:从使用了该方法的数组中删除、新增、修改操作
参数:一个或者多个
返回值:删除的元素组成的新数组
一个参数:
var arr1 = [1,2,3,4,5];
var arr2 = arr1.splice(1);
console.log('arr1',arr1); // [1]
console.log('arr2',arr2); // [2,3,4,5]
删除该位置之后的所有元素,被删除的元素组成一个新数组
两个参数:
var arr1 = [1,2,3,4,5];
var arr2 = arr1.splice(1,3);
console.log('arr1',arr1); // [1,5]
console.log('arr2',arr2); // [2,3,4]
删除第一个参数之后,项数为第二个参数的元素,被删除的元素组成一个新的数组
三个参数:
var arr1 = [1,2,3,4,5];
var arr2 = arr1.splice(1,3,9);
console.log('arr1',arr1); // [1,9,5]
console.log('arr2',arr2); // [2,3,4]
删除第一个参数与第二个参数之间的项(起始位置和结束位置都包含),被删除的元素组成一个新的数组,同时将第三个参数放到被删除的位置上
5) 数组迭代方法
forEach(function(){})
用法:遍历当前数组
参数:function(item,index,arr){}
每遍历一次,这个匿名函数就会被调用一次,forEach将当前遍历的元素、索引、当前数组,作为实参传递给这个匿名函数
返回值:无
var arr = ['hello','world','zhangsan'];
var result = arr.forEach(function(item,index,arr){
console.log('item',item); // 当前遍历的数组中的每一个元素
console.log('index',index); // 当前遍历的数组的每一个元素的索引
console.log('arr',arr); // 当前遍历的数组
})
console.log(result); // undefined
every()
用法:判断一个数组中的所有元素是否都满足给定的条件
参数:function(item,index,arr){}
返回值:
当每次回调函数返回值都为true的时候,every方法的返回值才为true
只要回调函数有一次的返回值为false,every方法都返回false
var arr = [1,2,3,4,5];
var result = arr.every(function(item,index){
return item > 3;
});
console.log(result); // false
some()
用法:判断数组中是否有满足条件的元素
参数:function(item,index,arr){}
返回值:
只要回调函数有一次的返回值为true,some方法都返回true
var arr = [1,2,3,4,5];
var result = arr.some(function(item,index){
return item > 3;
});
console.log(result); // true
filter()
用法:筛选数组中满足条件的元素(过滤)
参数:function(item,index,arr){}
返回值:
只要有满足给定条件的元素时,返回这些元素组成的数组
var arr = [1,2,3,4,5];
var result = arr.filter(function(item,index){
return item > 3;
});
console.log(result); // [4,5]
map()
用法:使用给定条件处理数组(映射)
参数:function(item,index,arr){}
返回值:
返回一个处理后的数组
var arr = [1,2,3,4,5];
var result = arr.map(function(item,index){
return item > 3;
});
console.log(result); // [fasle,false,false,true,true]
var arr = [1,2,3,4,5];
var result = arr.map(function(item,index){
return item + 3;
});
console.log(result); // [4,5,6,7,8]
*6) 类数组对象转换为数组
jQuery
1. [...arguments],改方法只对拥有迭代器的有效
2. Array.from(arguments)
3. Array.prototype.slice.call(arguments)
function sayName(a,b){
console.log([...arguments]);
console.log(Array.from(arguments));
console.log(Array.prototype.slice.call(arguments));
}
sayName(1,2,3);
obj是我们自己创建的一个具有迭代器的类数组对象
var obj ={
0:'a',
1:'b',
length:2,
[Symbol.interator]:Array.prototype[Symbol.interator]
}
console.log([...obj]); // ['a','b']