JavaScript ES5的严格模式和数组常用方法

    技术2023-07-31  105

    JavaScript ES5


    ES5 严格模式(了解)

    因为 js 是一个相对松散的代码格式,所以写的时候没有很多要求严格模式:书写代码时,有严格的代码要求目前:基本上没有人开发使用严格模式
    一、开启严格模式
    如果你不设置,那么默认是使用正常模式进行开发如果你想设置,那么你就在作用域的最开始,写一个字符串 ‘use strict’ 表示 JS 代码需要在严格模式下数字而,如果不遵守就报错
    二、严格模式的要求
    定义变量必须有 var 关键字
    <script> 'use strict' // 有这个字符串就是开启严格模式, 没有就是正常模式 // 定义变量必须有 var 关键字 // 非严格模式下 : 直接给变量赋值, 因为变量的赋值规则, 会默认吧这个 num 定义为全局变量 // 严格模式下 : 如果没有定义变量, 直接给变量进行赋值, 那么直接报错 num = 100 console.log(num) // 报错:num is not defined </script>
    我们书写 八进制 数字的时候,不能以 0 开头,必须以 0o 开头
    <script> 'use strict' // 有这个字符串就是开启严格模式, 没有就是正常模式 // 书写 八进制 数字必须以 0o 开头 // 非严格模式下 : 010 表示 八进制 的 10 转换成 十进制 就是 8 // 严格模式下 : 010 报错 // 严格模式下 : 0o10 表示 八进制 的 10 转换成 十进制 就是 8 var n1 = 0o10 console.log(n1) // 8 </script>
    定义函数,必须卸载代码的最开始,不能写在 if 或者 for 或者 … 之中
    <script> 'use strict' // 有这个字符串就是开启严格模式, 没有就是正常模式 // 定义函数必须写在代码的一开始 // 非严格模式下 : 函数可以定义在 if 语句里面 // 严格模式下 : 函数不可以定义再 if 语句里面 var num = 100 if (true) { function fn() { console.log('我是 if 条件里面定义的 fn 函数') } } fn() console.log(num) // 报错:fn is not defined </script>
    不允许函数定义两个相同的形参
    <script> 'use strict' // 有这个字符串就是开启严格模式, 没有就是正常模式 // 不允许函数定义两个相同的形参 // 非严格模式下 : 可以定义两个一样的形参 // 严格模式下 : 不允许两个一样的形参出现 function fn(a, a) { // 其实这里就是对 a 形参进行了两次赋值, 10 就没有了 console.log(a) // 报错:Duplicate parameter name not allowed in this context } fn(10, 20) </script>

    ES5 的数组常用方法

    迭代方法

    一、indexOf( ) 方法

    作用:查找数组中有没有某一个数据(按照索引正序查找 0 1 2 3 …)

    语法:

    数组.indexOf(要查找的数据)数组.idnexOf(要查找的数据, 从哪一个索引开始)

    返回值:是一个数字

    如果有你要查找的数字,那么返回的是第一个找到的数据的索引如果没有你要查找的数据,那么返回的是 -1 var arr = ['hello', 'world', '你好', '世界', 'world'] // 表示我要再 arr 这个数组里面查找有没有 'world' 这个数据 var res = arr.indexOf('world') console.log(res) // 1 // 表示我要再 arr 这个数组里面从 索引 2 开始向右查找, 看看有没有 'world' var res = arr.indexOf('world', 2) console.log(res) // 4
    二、lastIndexOf( ) 方法

    作用:查找数组中有没有某一个数据(按照索引倒叙查找 9 8 7 6 …)

    语法:

    数组.lastIndexOf(你要查找的数据)数组.lastIndexOf(你要查找的数据, 从哪一个索引开始)

    返回值:是一个数字

    如果找到你要查找的数据了,那么就返回第一个找到的数据的索引如果没有找到你要查找的数据,那么就返回 -1 var arr = ['hello', 'world', '你好', '世界', 'world'] // 表示从数组的最后开始向前查找, 看看有没有 'world' var res = arr.lastIndexOf('world') console.log(res) // 4 // 表示从索引 3 开始向前查找, 看看数组里面有没有 'world' 这个数据 var res = arr.lastIndexOf('world', 3) console.log(res) // 1
    三、forEach( ) 方法

    作用:就是用来循环遍历数组的,等价于 for 循环遍历数组的地位

    语法:

    数组.forEach(function (item, index, arr) {})

    返回值:没有

    var arr = ['hello', 'world', '你好', '世界'] // 目前, 数组里面有 4 个成员, 那么这个 function () {} 就执行 4 次 arr.forEach(function (item, index, arr) { // 这个函数, 会根据数组中有多少成员, 就执行多少回 // 第一个形参 item : 数组里面的每一项 // 第二个形参 index : 每一项的索引 // 第三个形参 arr : 表示原始数组 console.log('索引 ' + index + ' 是' + ' --- ' + item) console.log(arr) console.log('函数执行一次完毕') }) /* 上面的注释 : 函数第一次执行的时候 item === 'hello' index === 0 函数第二次执行的时候 item === 'world' index === 1 ... */
    四、map() 方法
    作用:映射一个数组,是把原始数组里面的每一个数据映射到新数组里面返回语法: 数组.map(function (item, index, arr) {}) 返回值:就是一个新数组 里面的每一项是从原始数组中映射过来的 var arr = [10, 100, 1000] var res = arr.map(function (item, index) { // 这个函数会根据数组中有多少成员执行多少回 console.log(item, index) // 映射到新数组里面 return item * 1.3 }) console.log(res) // [13, 130, 1300] console.log(arr) // [10, 100, 1000] /* 解释上面代码执行过程 map 函数的底层封装 先准备一个空数组 [] 开始循环 arr 这个原始数组 第一次的时候, item === 10 return item * 1.3 他就把第一次 return 的结果放在新数组里面 [13] 第二次的时候, item === 100 return item * 1.3 他就把第二次 return 的结果放在新数组的后面 [13, 130] 第三次的时候, item === 1000 return item * 1.3 他就把第三次 return 的结果放在新数组的后面 [13, 130, 1300] 到这里 循环结束, 提前准备好的数组变成了 [13, 130, 1300] map 方法把这个数组返回 */
    五、filter( ) 方法
    作用:把原始数组里面满足条件的数据过滤出来,放在一个新数组里面语法: 数组.filter(function (item, index, arr) {}) 返回值:就是一个新数组 里面的每一项都是从原先数组只能够过滤出来的 var arr = [3, 4, 5, 6] var res = arr.filter(function (item, index) { // 这个函数回根据 arr 数组有多少项执行多少回 console.log(item, index) // 按照你的条件来过滤数组 return item < 5 }) console.log(res) //[3, 4] /* 解释上面代码执行过程 : filter 的底层封装 先准备一个空数组 [] 函数第一次执行的时候 item === 3 index == 0 return item > 4 如果这一次 return 出来的是一个 true, 那么就把这一项放在新数组里面 如果这一次 return 出来的是一个 false, 那么就不放进新数组, 继续下一次 [] 函数第二次执行的时候 item === 4 index == 1 return item > 4 如果这二次 return 出来的是一个 true, 那么就把这一项放在新数组里面 如果这二次 return 出来的是一个 false, 那么就不放进新数组, 继续下一次 [] 函数第三次执行的时候 item === 5 index == 2 return item > 4 如果这三次 return 出来的是一个 true, 那么就把这一项放在新数组里面 如果这三次 return 出来的是一个 false, 那么就不放进新数组, 继续下一次 [5] 函数第四次执行的时候 item === 6 index == 3 return item > 4 如果这四次 return 出来的是一个 true, 那么就把这一项放在新数组里面 如果这四次 return 出来的是一个 false, 那么就不放进新数组, 继续下一次 [5, 6] 到此, 循环结束, 准备好的数组变成了 [5, 6] filter 方法把 这个数组返回给你 */
    六、every( ) 方法
    语法:就是判断数组里面是不是每一个都是符合条件的语法: 数组.every(function (item, index, arr) {}) 返回值:是一个布尔值 如果数组里面所有的数据都是满足条件的,那么返回 true只要数组里面有任意一个不满足条件,那么返回 false var arr = [10, 20, 30, 40] var res = arr.every(function (item, index) { // 这个位置的函数回根据 arr 数组有多少成员执行多少回 // item : 表示每一项 // index : 表示索引 console.log(item, index) // 书写你的判断条件 return item > 0 }) console.log(res) // true /* 上面代码执行步骤解析 every 方法的底层封装 先准备了一个变量值是 true 函数第一次执行, item === 10 return item > 0 如果 return 出来的是一个 true, 那么循环继续, 什么也不做 如果 return 出来是一个 false, 那么把准备好的变量变成 false, 停止循环直接结束 函数第二次执行, item === 20 return item > 0 如果 return 出来的是一个 true, 那么循环继续, 什么也不做 如果 return 出来是一个 false, 那么把准备好的变量变成 false, 停止循环直接结束 函数第三次执行, item === 30 return item > 0 如果 return 出来的是一个 true, 那么循环继续, 什么也不做 如果 return 出来是一个 false, 那么把准备好的变量变成 false, 停止循环直接结束 函数第四次执行, item === 50 return item > 0 如果 return 出来的是一个 true, 那么循环继续, 什么也不做 如果 return 出来是一个 false, 那么把准备好的变量变成 false, 停止循环直接结束 循环结束以后, 准备的变量依旧是 true, 表示你数组里面的每一个数据都满足条件 直接 every 方法返回 true 循环结束以后, 准备的变量变成了 false, 表示你数组里面至少有一个是不满足条件 直接 every 方法返回 false */
    七、some( ) 方法
    语法:就是判断数组里面是不是某一个是否和条件的语法: 数组.some(function (item, index, arr) {}) 返回值:是一个布尔值 如果数组里面有任何一个是满足条件的,那么返回 true只有数组里面所有的都不满足条件的时候,返回 false var arr = [10, 20, 30, 40] var res = arr.some(function (item, index) { // 这个函数回根据 arr 数组里面的成员数量执行多少次 console.log(item, index) // 写一个你要判断的条件 return item > 40 }) console.log(res) // false /* 上面代码执行解析 some 方法的底层封装 先准备一个变量, 赋值为 false 函数第一次执行, item === 10 return item > 40 如果 return 的是一个 false, 那么什么也不做, 循环继续 如果 return 的是一个 true, 那么直接结束循环, 把提前准备好的变量赋值为 true 函数第二次执行, item === 20 return item > 40 如果 return 的是一个 false, 那么什么也不做, 循环继续 如果 return 的是一个 true, 那么直接结束循环, 把提前准备好的变量赋值为 true 函数第三次执行, item === 30 return item > 40 如果 return 的是一个 false, 那么什么也不做, 循环继续 如果 return 的是一个 true, 那么直接结束循环, 把提前准备好的变量赋值为 true 函数第四次执行, item === 40 return item > 40 如果 return 的是一个 false, 那么什么也不做, 循环继续 如果 return 的是一个 true, 那么直接结束循环, 把提前准备好的变量赋值为 true 循环结束的时候, 如果准备好的变量依旧是 false 表示数组里面每一个都不满足条件 some 方法直接返回 false 循环结束的时候, 如果准备好的变量变成了 true 表示数组里面至少有一个满足条件了 some 方法直接返回 true */

    归并方法

    经过对数组中数据的操作,得到一个值
    一、reduce( ) 方法

    作用:经过对数组中数据的求和操作,得到一个值

    语法:

    数组.reduce(function (sum, item, index, arr) {})

    返回值:是一个值(所有数据的和)

    var arr = [1, 2, 3, 4, 5, 6, 7] var res = arr.reduce(function (sum, item, index, arr){ // 返回所有数据的和 return (sum + item) }) console.log(res) // 28
    Processed: 0.009, SQL: 10