前端知识点回顾——Javascript篇(三)

数组的冒泡、选择和插入排序法

冒泡排序法(从小到大)

function bubble(arr){
    for(let i = 0 ;i<arr.length-1;i++){
        for(let j = i+1;j<arr.length;j++){
            if(arr[j]<arr[i]){
                let temp = arr[j];
                arr[j] = arr[i];
                arr[i] = temp;
            }
        }
    }
    return arr;
}

选择排序法(从小到大)

function select(arr){
    for(let i = 0 ;i<arr.length-1;i++){
        let index = i;
        for(let j = i+1;j<arr.length;j++){
            if(arr[j]<arr[index]){
                index = j;
            }
        }
        if(index !== i){
            let temp = arr[index];
            arr[index] = arr[i];
            arr[i] = temp;
        }
    }
    return arr;
}

插入排序法(从小到大)

function insert(arr){
    for(let i = 1;i<arr.length;i++){
        let temp = arr[i];
        for(var j = i-1;j>=0;j--){  //注意这里必须是var声明
            if(arr[j]>temp){
                arr[j+1] = arr[j];
            }else{
                break;
            }
        }
        arr[j+1] = temp;
    }
    return arr;
}

ES6函数参数的默认值

  • 设定默认值的参数应该是函数的尾参数,只有在该值为undefined的情况下才会取得默认值
function f(x = 1, y) {
  return [x, y];
}

f() // [1, undefined]
f(2) // [2, undefined])
f(, 1) // 报错
f(undefined, 1) // [1, 1]
  • 指定默认值后,函数的length属性会失真,将返回没有指定默认值的形参个数。
  • 一旦设置了参数的默认值,函数进行声明初始化时,参数会形成一个单独的作用域。等到初始化结束,这个作用域就会消失。这种语法行为,在不设置参数默认值时,是不会出现的。(参数是由let声明的)
var x = 1;
function f(x, y = x) {  //调用函数时,参数形参单独作用域,这里默认值x指向了第一个参数x
    console.log(y);
}
f(2); // 2           x接收实参2,所以y=x=2
f(); //undefined     x没有接收到实参,为undefined,所以y=x=undefined
let x = 1;
function f(y = x) {  //函数调用时,参数y = x形成一个单独的作用域。这个作用域里面,变量x本身没有定义,所以指向外层的全局变量x
  let x = 2;
  console.log(y);
}
f() // 1
var x = 1;
function foo(x = x) {
  // ...
}
foo() // ReferenceError: x is not defined
//参数x = x形成一个单独作用域。实际执行的是let x = x,由于暂时性死区的原因,这行代码会报错”x 未定义“
var x = 1;
function foo(x, y = function() { x = 2; }) {  //这里匿名函数的x指向第一个参数x
  var x = 3;
  y();
  console.log(x);
}
foo()//3
x//1

var x = 1;
function foo(x, y = function() { x = 2; }) {
  x = 3;  //如果把var去掉,那么这里的x就指向了第一个参数x
  y();
  console.log(x);
}
foo() // 2
x // 1

ES6对数组的一些拓展

Array.from(arg1,arg2,arg3)

arg1为类数组对象(Nodelist/arguments),arg2为类似map方法接受一个函数对每一个元素进行处理,将返回值放入数值中,arg3指定函数的this指向

Array.of()

主要目的,是弥补数组构造函数Array()的不足。因为参数个数的不同,会导致Array()的行为有差异。

//Array
Array() // []
Array(3) // [, , ,]
Array(3, 11, 8) // [3, 11, 8]

Array.of(3, 11, 8) // [3,11,8]
Array.of(3) // [3]
Array.of(3).length // 1

实例方法copyWithin(target, start, end)

在当前数组内部,将指定位置的成员复制到其他位置(会覆盖原有成员),然后返回当前数组

  • target(必需):从该位置开始替换数据。
  • start(可选):从该位置开始读取数据,默认为 0。如果为负值,表示倒数。
  • end(可选):到该位置前停止读取数据,默认等于数组长度。如果为负值,表示倒数。

数组实例的 find() 和 findIndex()

类似filter方法,第一个参数为回调函数,所有数组成员依次执行该回调函数,直到找出第一个返回值为true的成员,然后返回该成员/下标。如果没有符合条件的成员,则返回undefined/-1 。 第二个参数指定this对象。

数组实例的 entries(),keys() 和 values()

entries(),keys()和values()——用于遍历数组。它们都返回一个遍历器对象,可以用for...of循环进行遍历,唯一的区别是keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历。

for (let index of ['a', 'b'].keys()) {
  console.log(index);
}
// 0
// 1

for (let elem of ['a', 'b'].values()) {
  console.log(elem);
}
// 'a'
// 'b'

for (let [index, elem] of ['a', 'b'].entries()) {
  console.log(index, elem);
}
// 0 "a"
// 1 "b"

数组实例的 includes()

方法返回一个布尔值,表示某个数组是否包含给定的值。该方法的第二个参数表示搜索的起始位置,默认为0。如果第二个参数为负数,则表示倒数的位置。

[1, 2, 3].includes(2)     // true
[1, 2, 3].includes(4)     // false
[1, 2, NaN].includes(NaN) // true

因它能正确判断NaN,因此可以用来弥补indexOf方法的不足。

ES6对对象的一些拓展

Object.is()

ES5 比较两个值是否相等,只有两个运算符:相等运算符()和严格相等运算符(=)。它们都有缺点,前者会自动转换数据类型,后者的NaN不等于自身,以及+0等于-0。

相对于运算符,此方法不同之处只有两个:一是+0不等于-0,二是NaN等于自身。

+0 === -0 //true
NaN === NaN // false

Object.is(+0, -0) // false
Object.is(NaN, NaN) // true

Object.assign()

Object.assign方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target)

Object.assign方法的第一个参数是目标对象,后面的参数都是源对象。

注意,如果目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性

let target = { a: 1 };
let source1 = { b: 2 };
let source2 = { c: 3 };

Object.assign(target, source1, source2);
console.log(target) // {a:1, b:2, c:3}

Object.assign(obj) === obj // true  assign自身则返回自身

Object.keys(),Object.values(),Object.entries()

Object.keys方法,返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键名。

Object.values方法返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键值(字符串形式)。

Object.entries方法返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键值对数组。

Editted by: simple

——还在摸爬滚打中的前端小萌新
原文地址:https://www.cnblogs.com/simpul/p/11020216.html