在js中in可以用来查寻一个值是否存在数组/对象中，存在为ture否则为false
var arr=[1,2,3,4,5]
console.log(2 in arr) //true
var arr={2:3,4:5}
console.log(2 in arr) //true
console.log(3 in arr) //false
对象是查找键
for of
只有es6的map数据类型才支持两个参数的形式遍历，普通的数据类型用for in和for of都只支持一个参数
且es6的map数据类型不能用for in遍历，遍历没反应但不会报错，因为他是一个类数组
es6的map数据类型的之所以能支持两个参数去遍历，因为它的键值是['name', 'chen'] 数组形式，相当于解构赋值
// 声明一个Map
var map1 = new Map();
// 添加元素
map1.set('name','chen');
map1.set('age',23).set('height',180);
console.log(map1); //Map(3) {'name' => 'chen', 'age' => 23, 'height' => 180}
// 循环遍历
for(let key of map1){
console.log(key); //['name', 'chen'] ['age', 23] ['height', 180]
// 循环遍历
for(let [key,value] of map1){
console.log(key,value); //name chen age 23 height 180
}
//遍历数组
var arr=[1,2,3,4,5]
for (var i of arr) {
console.log(i) //1 2 3 4 5
}
//遍历对象
var obj1 = {
str1 :666,
age :18
};
for (var item of obj1) { // Uncaught TypeError: obj1 is not iterable
console.log(item);
}
for of不能遍历对象，因为for of 循环首先会向被访问对象请求一个迭代器对象，然后通过调用迭代器对象的next() 方法来遍历所有返回值。
for of能遍历的有set map array string因为这些类型有迭代器对象，但是object没有迭代器对象所以无法遍历对象
for in
//遍历数组
var arr=[1,2,3,4,5]
for (var i in arr) {
console.log(i) //0 1 2 3 4
}
//遍历对象
var obj1 = {
str1 :666,
age :18
};
for (var item in obj1) {
console.log(item); //str1 age
console.log(obj1[item]) //666 18
}
js中的对象
将一些函数与对象封装起来就是对象，所谓封装在语法层面就是，把函数和变量用英文大括号{}包起来。使用：key：value的形式，value可以是对象的值，也可以是对象的地址。
key的值可以不符合标识符的命名规范，但必须使用引号引起来，比如’12qw'：88。每个键值对之间使用英文逗号隔开。
function f(a) {
console.log(a);
console.log(1)
};
var obj1 = {
str1: 'woaini',
p: "sss",
'12qw':88，
fun: f, //f只是赋值
fun1: function() {
console.log(2)
}
};
obj1.fun(5) //5 1 //fun()才是调用
obj1.fun1(); //2
如果一个键的值是一个函数，则称这个键名为这个对象的方法。如果一个键的值是基本数据类型，则称这个键名为这个对象的属性。
对象的嵌套
即对象的属性仍然可以是一个对象。运算符.表示getattr的意思，即访问对象属性
var obj1 = {
obj_inn: obj2 = {
num: 8
}
};
console.log(obj1.obj_inn.num); //8
对象的属性与修改
1.使用点.运算符
var obj1 = {
str1: 'ni',
};
console.log(obj1.str1);
2.使用[]符号
var obj1 = {
str1: 'ni',
};
console.log(obj1['str1']) //ni
添加属性
var obj1 = {
};
obj1.name = 'ming';
obj1['age'] = 10; //[]符号
console.log(obj1); //{name: 'ming', age: 10}
使用Object.keys(obj)方法查看对象所有属性
使用Object.values(obj)方法查看对象所有的属性值
var obj1 = {
str1: 'woaini',
age:10
};
console.log(Object.keys(obj1)) // [ 'str1', 'age' ]
console.log(Object.values(obj1)) // ['woaini', 10]
使用delete()方法删除对象属性
删除一个对象里不存在的属性不仅不会报错而且还会返回true。当试图删除一个无法删除的属性时，则会返回false。删除对象属性：实际上是与相关的对象进行解绑。
var obj1 = {
str1 :666,
age :18
};
console.log(obj1); //{str1: 666, age: 18}
console.log(delete obj1.age) // true
console.log(delete obj1.p) // true
console.log(delete obj1); //false
console.log(obj1); //{str1: 666}
Object对象，它类似于基类，是所有对象的老大
Object本身就是一个对象，可以给他添加属性和方法。利用键值对形式给对象添加的方法叫做Object本身方法。只能使用Object.funcname()来执行。
Object.add = function() {
console.log(1)
}
Object.add()
使用Object.prototype.name()形式添加的方法称为对象的实例方法。可以被任意对象使用。
function f() {
console.log(1)
};
Object.prototype.fun = f;
var obj = {}
obj.fun()
可以再一个函数的函数体里面调用另一个函数
每个函数的函数体不超过50行，如果超过的话最好拆分，使用函数进行搭积木实现功能。
高阶reduce
arr.reduce(callback，initialValue)
callback 是执行数组中每个值的函数，包含四个参数
reduce 为数组中的每一个元素依次执行回调函数，不包括数组中被删除或从未被赋值的元素，接受四个参数：初始值（或者上一次回调函数的返回值），当前元素值，当前索引，调用 reduce 的数组。
1、previousValue （上一次回调函数的返回值或者是提供的初始值（initialValue））（首次遍历如果没有初始值，则拿数组的第一个值（作为上一次回调函数的返回值），有初始值，则拿初始值）
2、currentValue （数组中当前被处理的元素） （没有初始值，取数组第二个的值，有初始值取数组第一个值）
3、index （当前元素在数组中的索引）
4、array （调用 reduce 的数组）
注意：回调函数（函数）确实每次都可以return返回值，但return不return,return什么取决于你的数据处理
简单用法
var arr = [1, 2, 3, 4];
var sum = arr.reduce((x,y)=>x+y)
var mul = arr.reduce((x,y)=>x*y)
console.log( sum ); //求和，10
console.log( mul ); //求乘积，24
var arr = [1, 2, 3, 4];
var sum = arr.reduce(function(prev, cur, index, arr) {
return prev + cur;
}，0) //注意这里设置了初始值
console.log(arr, sum); // [1, 2, 3, 4] 10
高阶应用
1.计算数组中每个元素出现的次数
let names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];
let nameNum = names.reduce((pre,cur)=>{
if(cur in pre){ //
pre[cur]++
}else{
pre[cur] = 1
}
return pre
},{})
console.log(nameNum); //{Alice: 2, Bob: 1, Tiff: 1, Bruce: 1}
2.数组去重
let arrs = [1,2,3,4,4,1]
let newArr = arrs.reduce((pre,cur)=>{
console.log(pre);
console.log(cur);
if(!pre.includes(cur)){
return pre.concat(cur) //array1.concat(array2,array3,...,arrayX)，js的concat() 方法用于连接两个或多个数组/字符。该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。 //array1不能是字符，其他数组可以改成字符也行
}else{
return pre
}
},[])
console.log(newArr);// [1, 2, 3, 4]
;
3.将二维数组转化为一维
js提供flat()方法可以直接实现将多维数组转化为一维，但思路也是reduce和concat
let arr = [[0, 1], [2, 3], [4, 5]]
let newArr = arr.reduce((pre,cur)=>{
return pre.concat(cur)
},[])
console.log(newArr); // [0, 1, 2, 3, 4, 5]
4.将多维数组转化为一维 (纯纯的递归，头大，递归心得：函数内部调用函数，一层一层的嵌套，但return出函数是内部先执行完已经return了，外部再相应的执行)
//跟二维数组转化为一维思路不太一样，这个思路是把整个数组中的每一个元素包含的字符一个一个的扒出来连接后再去连接数组中其他元素
let arr = [[0, 1], [2, 3], [4,[5,6,7]]]
const newArr = function(arr){
return arr.reduce((pre,cur)=>pre.concat(Array.isArray(cur)?newArr(cur):cur),[])
} //Array.isArray(obj) 方法用于判断一个对象是否为数组。如果对象是数组返回 true，否则返回 false。
console.log(newArr(arr)); //[0, 1, 2, 3, 4, 5, 6, 7]
5.对象里的属性求和
var result = [
{
subject: 'math',
score: 10
},
{
subject: 'chinese',
score: 20
},
{
subject: 'english',
score: 30
}
];
var sum = result.reduce(function(prev, cur) {
return cur.score + prev;
}, 0);
console.log(sum) //60
6.获取数组内所有的value值
const arr = [
{
value: 'zhinan',
label: '指南',
children: [
{
value: 'shejiyuanze',
label: '设计原则',
children: [
{
value: 'yizhi',
label: '一致'
},
{
value: 'fankui',
label: '反馈'
}
]
},
{
value: 'daohang',
label: '导航',
children: [
{
value: 'cexiangdaohang',
label: '侧向导航'
},
{
value: 'dingbudaohang',
label: '顶部导航'
}
]
}
]
}
];
const getValueList = (arr) => {
return arr.reduce((pre, cur) => {
if (cur.children) {
pre.push(cur.value)
pre.push(...getValueList(cur.children))
} else {
pre.push(cur.value)
}
return pre
}, [])
};
console.log(getValueList(arr)); // ['zhinan', 'shejiyuanze', 'yizhi', 'fankui', 'daohang', 'cexiangdaohang', 'dingbudaohang']
686
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
