Js高程第五章第一二节 Object Array二次学习

Object

创建:
1.let a = new Object()
2.let b = {} 使用这种方式不会调用Object的构造函数
调用:
1.a.name
2.a.[“name”] 若使用了空格或保留字的属性名则需要用方括号调用

Array

创建:
1.let arr = new Array() 括号内可以是数字(长度)也可以是一个数组(数组的初始项)
2.let brr = Array()
3.let crr = [ ] 与对象一样,在使用数组字面量表示法时,也不会调用 Array 构造函数
调用:
1.arr[n]如果索引小于数组中的项数,则返回对应项的值
若数组长度比n小则数组就会自动增加到该索引值加 1 的长度
注:数组的长度属性不是只读的 数组最多可以包含 4294967295 个项
2.arr[length] = x 可以通过这种方式向数组末尾添加数

1.数组检测
1.1 instanceof
arr instanceof Array //true
instanceof假定只有一个全局执行环境 因此在包含多个框架的网页中
即有多个全局环境 因此有多个Array构造函数 所以最好在没有其他框架是使用
1.2 isArray()
Array.isArray(arr) //true
无论在哪个全局环境都可以检测
IE9以上基本都可以实现

2.转换方法
2.1.toLocaleString() 大致与toString()相同 有细微差距见代码
2.2.toString() 返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串
2.3.valueOf() 返回数组 这个数组由原数组中的每一项执行toString()得到
注:alert()要接收字符串参数 所以它会在后台调用 toString()方法

//toString toLocaleString
    var person1 = {
      toLocaleString: function () {
        return "Nikolaos";
      },
      toString: function () {
        return "Nicholas";
      }
    };
    var person2 = {
      toLocaleString: function () {
        return "Grigorios";
      },
      toString: function () {
        return "Greg";
      }
    };
    var people = [person1, person2];
    alert(people); //Nicholas,Greg
    alert(people.toString()); //Nicholas,Greg
    alert(people.toLocaleString()); //Nikolaos,Grigorios

通过这些方法转换的数组都以逗号分隔 可以用join()改变
arr.join("||") //a||b||c||d

3.栈方法
1.push() //添加元素至末尾 返回修改后的数组
2.pop() //移除数组最后一项 减少数组长度 返回移除的项

4.队列方法
1.push()
2.shift() //移除数组第一项 减少数组长度 返回移除项

unshift() //在数组前端添加任意项并返回数组长度 用pop加unshift可以模拟反向队列

5.重排序方法
1.reverse() //反转数组项顺序
2.sort() //默认sort()方法按升序排列数组项为了
实现排序,sort()方法会调用每个数组项的 toString()转型方法,然后比较得到的字符串,以确定如何排序
因此若是对数字排序需要定义一个比较函数作为sort(compare())的参数

    let arr = [1,4,7,2,10,33,6,4, 4]
    const compare = (v1, v2) => {
      return v1 > v2 ? 1 : -1	//交换1和-1则可以变成降序排序
    }
    arr.sort(compare)		// [1, 2, 4, 4, 6, 7, 10, 33]

6.操作方法
1.concat() //concat()方法可以基于当前数
组中的所有项创建一个新数组。具体来说,这个方法会先创建当前数组一个副本,然后将接收到的参数
添加到这个副本的末尾,最后返回新构建的数组。

    let colors = ['red', 'green', 'blue']
    let upColors = colors.concat('yellow', ['black', 'brown'])
    // ["red", "green", "blue", "yellow", "black", "brown"]

2.slice()
//在只有一个参数的情况下,slice()方法返回从该参数指定位置开始到当前数组末尾的所有项
//如果有两个参数,该方法返回起始和结束位置之间的项但不包括结束位置的项

var colors = ["red", "green", "blue", "yellow", "purple"]; 
var colors2 = colors.slice(1); 
var colors3 = colors.slice(1,4); 
alert(colors2); //green,blue,yellow,purple 
alert(colors3); //green,blue,yellow

3.splice()至少接受两个参数 返回值为被删除项
//两个参数:要删除的第一项的位置和要删除的项数splice(0,2)会删除数组中的前两项
//三个参数:前两项与两个参数时作用相同 第三及之后的参数为在删除后的位置插入的项

    let colors = ['red', 'green', 'blue']
    let twoArgs = colors.splice(0, 1) //return red  remain green blue
    let threeArgs = colors.splice(1, 1, "new1", "new2") //return blue remain red new1 new2

**7.位置方法 这两个方法都接收两个参数:要查找的项和(可选的)表示查找起点位置的索引
1.indexOf()
2.lastindexOf() //从后往前
都返回要查找的项在数组中的位置,或者在没找到的情况下返回-1且要求查找的项必须严格相等(===)
**

    let numbers = [1,2,3,4,5,6,7,8,9,4]
    console.log(numbers.indexOf(4))	//一参数	3
    console.log(numbers.indexOf(4, 5))	//二参数	9

8.迭代方法
每个方法都接收两个参数:要在每一项上运行的函数和(可选的)运行该函数的作用域对象——影响 this 的值
传入这些方法中的函数会接收三个参数:数组项的值、该项在数组中的位置和数组对象本身。
根据使用的方法不同,这个函数执行后的返回值可能会也可能不会影响方法的返回值

1.every() //传入的函数必须对每一项都返回 true 这个方法才返回 true
2.some() //只要传入的函数对数组中的某一项返回 true 就会返回 true
字面理解 every表示每个 some表示某个

    let numbers = [1,2,3,4,5,6,7,8,9,4]
    let everyResult = numbers.every((item, index, array) => {
      return (item > 2)
    })
    console.log(everyResult)	//false

    let someResult = numbers.some((item, index, array) => {
      return (item > 2)
    })
    console.log(someResult)		//true

3.filter() //用指定的函数确定是否在返回的数组中包含某一项 返回符合过滤条件的项

    let filterResult = numbers.filter((item, index, array) => {
      return (item > 2)
    })
    console.log(filterResult)	//[3, 4, 5, 6, 7, 8, 9, 4]

4.map() //map()返回一个数组 且数组的每一项都是在原始数组中的对应项上运行传入函数的结果

    let mapResult = numbers.map((item, index, array) => {
      return item * 2
    })
    console.log(mapResult)	//[2, 4, 6, 8, 10, 12, 14, 16, 18, 8]

5.forEach() //对数组中的每一项运行传入的函数
这个方法没有返回值 本质上与使用 for 循环迭代数组一样

    let eachResult = numbers.forEach((item, index, array) => {
      array = ++array[index] 	//数组每一项加1
    })
    console.log(numbers) 	//[2, 3, 4, 5, 6, 7, 8, 9, 10, 5]

9.归并方法
1.reduce() //从第一项遍历到最后
2.reduceRight() //从最后一项向前遍历
这两个方法都会迭代数组的所有项,然后构建一个最终返回的值
这两个方法都接收两个参数:一个在每一项上调用的函数 和 (可选的)作为归并基础的初始值
函数接收 4 个参数:前一个值、当前值、项的索引和数组对象
这个函数返回的任何值都会作为第一个参数自动传给下一项
第一次迭代发生在数组的第二项上,因此第一个参数是数组的第一项,第二个参数就是数组的第二项

    let reduceResult = numbers.reduce((prev, cur, index, array) => {
      return prev + cur
    })
    console.log(reduceResult)  //59

第一次执行回调函数prev是1 cur是2 第二次prev是3(1加2的结果) cur是3(数组的第三项)
reduceRight()的作用类似,只不过方向相反而已

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值