1.数组

1.1.数组的创建方式

字面量创建

//底层实现： new Array();
var arr = [];

数组构造函数创建

var arr1 = new Array();

1.2.js内置数组对象的方法

toString()   将数组中的每一项拿出来，使用逗号隔开，变成一个字符串

valueOf()   返回数组本身

join() 使用一个字符将数组分割成一个字符串；join方法不传入参数，默认使用逗号分割

concat() 连接数组之后会返回一个新数组，例如[].concat(arr,arr1)

push() 在数组最后添加项；返回新数组的长度   可以添加多项数据，例如添加多项数据：arr.push(100,200,300,'哈哈哈','嘻嘻嘻')

pop()   删除数组最后一项；返回被删除的最后一项的值   只能删除最后一项

shift() 删除数组第一项；返回被删除这项的值  每次只能删除一个

unshift() 在数组最前面添加数据项；返回数组的长度；’可以添加多项；例如添加多项：arr.unshift('熊大','熊二','光头强')

splice() 删除数组的中指定项；有三个参数  删除数组中的数据项，原数组会被改变；不传入参数，就是将数组中的所有数据项全删除；传入一个值：表示的时候要删除的数据项的索引开始位置，一直到结束；两个参数的时候：第一个表示要删除的数据项的索引开始的位置，第二个值表示：要删除的个数；三个参数的时候：第1个表示要删除的数据项的索引开始位置，第二个值表示要删除的个数，后面的参数是替换删除掉是数据的位置；返回的是被删除的数据组成的数组

slice() 复制，用原来的数组中去复制一份数据出来  原数组中不会受影响；没有参数，相当于将原数组完整的复制了一份；一个参数，表示复制数组中的数据项的索引开始的位置，一直到数组结束位置；两个参数的时候，第一个表示复制数据项的索引开始的位置，第二个表示结束的索引的位置（但是这个位置上的值取不到）；返回赋值的数组

reverse() 数组翻转，会改变原数组，返回翻转后的数组

indexOf 获取数组元素的索引；一个参数时，表示查找该字符串的索引；两个参数时，，第二个参数表示查找的索引的开始位置；查找不到返回-1

includes() 检查数组中是否包含某一个数据 Array.prototype.incloudes() 是es7(es2016)的一个方法

1.3.string对象的方法

charAt()   根据索引获取对应位置的字符

concat()   拼接字符串；是对象的一个方法，要使用的时候一定要使用对象名.方法名()；例如：str.concat(str1)

split()   用来将字符串分割成一个数组的；返回的是一个数组

slice() 截取字符串中的某一部分；不会影响原来的字符串，返回一个新的字符串；当参数是一个值的时候，表示截取索引的开始位置；两个参数时第一个表示截取索引开始的位置，第二个表示索引结束的位置（这个位置上的字符取不到）；当传入一个负数的参数，从字符串的后面第一个开始算，第一个的索引就是-1.  一直截取到最后

substring() 截取字符串;不能使用负数，使用负数是无效

substr()   截取字符串；如果是一个参数表示截取字符串索引的开始位置；如果是两个参数，第一个表示截取字符串索引开始的位置，第二个参数表示截取的个数

replace() 字符串替换；第一个采纳数表示旧的字符串；第二个参数表示新的字符串，多个字符串只会替换一次

1.4.循环

forEach()

           arr.forEach(function(item,index) {
                 //item：表示循环的数组中的每一项
                 //index: 表示的时候每一项的索引
                 console.log(item+'--------------'+index);
           })

filter() 过滤器

        // ES6中提供的一个叫过滤器的函数   filter()   过滤   筛选：根据一定的条件来做筛选
        // 使用： filter(函数)    传入的函数中定义了一些筛选的条件
        // filter这个方法会返回一个新的数组
        var arr = [2000,3000,1500,1800,6000,5800];

        var res = arr.filter(function(item) {
            //item表示的就是arr这个数组中的每一项数据
            return item>2000;  //筛选条件， 返回arr数组中数据项值大于2000的数据项
        })

        console.log(res);

map() 映射

         // ES6中的映射map方法
        // 从后台过来一条数据：
        var arr = ['家用电器','手机','保健食品','护肤产品','空调']

        //  <li><a href=#>家用电器</a></li>

        //map方法也会返回一个新的数组    map方法底层实际上已经做了数组的循环遍历了

        var res = arr.map(function(item) {
            return '<li><a href=#>'+item+'</a></li>'
        })

        console.log(res);

some() 用于检测数组中的元素是否满足指定条件;如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测；如果没有满足条件的元素，则返回false；some() 不会对空数组进行检测

        var arr = [100, 200, 300, 400];
		// some能够查看是否找到，但是不能够取出这个数据
		var newArr = [];

		arr.some(function (val, index) {
			console.log( index );
			// 查找200，并且取出200;如果找到200就存到数组中
			if ( val >= 200 ) {
				// 满足这个条件的val就是我们要找的值，吧这个值拿出来装到newArr
				newArr.push(val);
				return true;
			}
			
		});

every() 用于检测数组所有元素是否都符合指定条件；如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测；如果所有元素都满足条件，则返回 true

var ages = [32, 33, 16, 40];

function checkAdult(age) {
    return age >= 18;
}

1.5.其他

1.5.1扩展运算符(展开运算符)

输出数据

// 输出数据
// 展开运算符其实是将里面的元素, 展开成逗号分隔的语法形式
// 展开运算符可以说一个语法糖, 本身并没有真正的作用
let arr = [1,2,3];
console.log(...arr);// 输出 1,2,3

借助concat()方法来复制数组

// // 数组是一个引用型的对象, 经常会有数据污染的困扰,
// // 如果通过展开运算符生成一个新数组, 两个数组之间就是互相独立的了

// 复制数组(原生)
let arr2  = arr.concat([]);
console.log(...arr2);//1 2 3

借助展开运算符合并数组

// 合并数组（es6）
let arr4 = [...arr,...arr2];
console.log(arr4);//[ 1, 2, 3, 1, 2, 3 ]

1.5.2.数组去重

借助set中元素不能重复的特点来帮助数组去重

// 数组去重
//使用set对象去重  set元素不能重复
let arrReply = [1,2,3,3,4,5,5];
let arr5 = [...new Set(arrReply)]
console.log(arr5);//[ 1, 2, 3, 4, 5 ]

// 数组生成set
let set = new Set(arr5);
console.log(set);

// set转化为数组
let arr6 = [...set];
console.log(arr6);

1.5.3. 合并对象

借助Object.assign()浅拷贝方法处理单层对象的合并

// 合并对象
// Object.assign 可以进行对象的合并
// 这个函数只要传入对象作为参数即可
let obj3 = {name:'tom'};
let obj4 = {age:17};
// 将后面的参数合并到第一个对象中,修改第一个对象
Object.assign(obj3,obj4);
console.log(obj3);

借助Object.assign()浅拷贝方法还可以处理单层对象的赋值

let obj7 = Object.assign({},obj6);
console.log(obj7);

1.5.4.解构

var student = {
    name: 'tom',
    age: 12,
    school: {
        name: 'xxx',
        address: 'yyy'
    }
}

// 解构对象内部对象的属性
// 解构语法方便这种从一个对象中提取属性, 赋值给变量的操作, 只需要一个花括号即可
let {name} = student.school;
console.log(name);

let {age, address} = student;
console.log(age,address);

1.5.5.遍历对象

for in 循环

let stu = {a:1, b:2, c:3};
// 4.1. for in 循环
for(let key in stu){
    console.log(stu[key]);
}

获取key值的集合

// 获取到所有key
let keyArr = Object.keys(stu);
console.log(keyArr);

keyArr.forEach(key=>{
    console.log(stu[key]);
});

综合示例

map很适合变更已有数据结构

let students = [
    { name: "小明", age: 18 },
    { name: "小红", age: 18 },
    { name: "小天", age: 18 },
]

// 1. 优先考虑, 不要影响原数组, 可以使用 map 映射
let newStus = students.map((item)=>{
    // 不要影响遍历出来的对象, 这个时候可以使用展开运算符进行复制
    return{
        ...item,
        school:'xxxx'
    }
});

console.log(students);
console.log(newStus);

【复习】javascript 数组，string对象，循环相关方法