内置对象

复习

• JavaScript包含：ECMAscript DOM BOM
• ECMAscript包含：变量、数据、运算符、条件分支语句、循环语句、函数、数组、对象...
• Javascript的对象包含三种：自定义对象、内置对象、浏览器对象
• ECMAscript的对象：自定义对象、内置对象
• 使用一个内置对象，只需要知道对象中有哪些成员，有什么功能，直接使用
• 可参考说明手册: W3C、MDN

MDN

Mozilla 开发者网络（MDN）提供有关开放网络技术（Open Web）的信息，包括 HTML、CSS和万维网及 HTML5 应用的 API。

• MDN官方网址：https://developer.mozilla.org/zh-CN/

如何学习一个方法

1. 方法的功能
2. 参数的意义和类型
3. 返回值的意义和类型
4. demo进行测试

Math对象

• 无构造函数，不用new
• Math对象它具有数学常数和函数的属性和方法，我们可以直接进行使用
• 常用的数学常数和函数的属性和方法

  Math.PI   圆周率
  Math.random()   生成随机数
  Math.floor()/Math.ceil()   向下取整/向上取整
  Math.round()   取整，四舍五入
  Math.abs()     绝对值
  Math.max()/Math.min()     求最大和最小值
  Math.sin()/Math.cos()     正弦/余弦
  Math.power()/Math.sqrt()  求指数次幂/求平方根

• 案例

  /*
      含义： Math.random（） 函数返回范围 0 到小于 1
      （包括 0，但不是 1）的浮点伪随机数，
      该值在该范围内分布大致均匀 ， 
      然后您可以缩放到所需的范围。
      
      参数：没有参数
      返回值：在0（包括）和1（不包括）之间的浮点伪随机数。
    */ 
     function getRandom() {
      return Math.random();
     }
     console.log(getRandom());

    /*
      demo测试：获取两个值之间的随机整数(包含最大值和最小值)
    */
    function getRandomIntInclusive(min, max) {
        // Math.ceil() 向上取整
        min = Math.ceil(min);
        // Math.floor() 向下取整
        max = Math.floor(max);
        /*  分析：[0,1) * 17(max - min + 1) -> [0,17)
                 [0,17) + 4 -> [4,21)
        */
        return Math.floor(Math.random() * (max - min + 1) + min); //The maximum is inclusive and the minimum is inclusive
    }
    console.log(getRandomIntInclusive(4,20));


    /*demo测试
      Math.max():函数返回base的exponent功率
    */
    console.log(Math.max(1,5,6,9,34,333,56,8));


    /*demo测试
      Math.pow()
      注意：如果基数为负，并且指数不是整数，则结果为NaN
    */
    // 相当于开方 Math.sqrt()函数返回数字的平方根
    console.log(Math.pow(16, 1/2)); // 4
    console.log(Math.sqrt(16));  // 4
    console.log(Math.pow(8, -1/3));


    /*demo测试
      Math.abs():函数返回数字的绝对值
    */
    console.log(Math.abs('-1'));     // 1
    console.log(Math.abs(-2));       // 2
    console.log(Math.abs(null));     // 0
    console.log(Math.abs(''));       // 0
    console.log(Math.abs([]));       // 0
    console.log(Math.abs([2]));      // 2
    console.log(Math.abs([1,2]));    // NaN
    console.log(Math.abs({}));       // NaN
    console.log(Math.abs('string')); // NaN
    console.log(Math.abs());         // NaN

Array对象

• 创建数组对象的两种方式
  • 字面量方式
  • new Array()构造函数方式

检测数组类型

• instanceof 检测某个实例是否是某个对象类型

    // 字面量方式
    var arr = [1,"4",[5,9],"haha"];
    console.log(arr);

    // new Array() 构造函数方法
    // 数组也是对象，可以通过构造函数生成
    var arr1 = new Array(); // 空的数组对象
    var arr2 = new Array("lala",8,[4,5]);
    console.log(arr1);
    console.log(arr2);

    var arr3 = {};

    // 检测数组类型  结果返回：true\false
    console.log(arr instanceof Array); // true
    console.log(arr1 instanceof Array); // true
    console.log(arr3 instanceof Array);  // false

toString()

把数组转换成字符串，逗号分隔每一项

  var arr2 = new Array("lala",8,[4,5]);
  var str = arr2.toString();
  console.log(str); // lala,8,4,5

数组的常用方法

首尾数据操作

  push()  在数组末尾添加一个或多个元素，并返回数组操作后的长度
  pop()   删除数组最后一项，返回删除项
  shift() 删除数组第一项，返回删除项
  unshift()  在数组开头添加一个或多个元素，并返回数组的新长度

• 实际案例：通过将每次数组的第一数放在数组末尾，循环执行四次，还原为原始数组。

    // 原始数组
    var arr = [6,4,8,9];

    // 删除数组第一项，返回删除项
    var one = arr.shift();
    // 数组末尾添加元素，返回数组长度
    console.log(arr.push(one));
    console.log(arr);  // [4,8,9,6]

    var one = arr.shift();
    // 数组末尾添加元素，返回数组长度
    console.log(arr.push(one));
    console.log(arr);  // [8,9,6,4]

    var one = arr.shift();
    // 数组末尾添加元素，返回数组长度
    console.log(arr.push(one));
    console.log(arr);  // [9,6,4,8]

    var one = arr.shift();
    // 数组末尾添加元素，返回数组长度
    console.log(arr.push(one));
    console.log(arr);  // [6,4,8,9]

合并concat()

将两个数组合并成一个新的数组，原数组不受影响。参数位置可以是一个数组字面量、数组变量、零散的值。

   //合并
    var arr = [5,8,9];
    var arr2 = ["halou",7];
    //合并数组字面量
    console.log(arr2.concat(arr));
    //合并数组变量 
    var arr3 = new Array(1,1,"come on");
    console.log(arr2.concat(arr3));
    //合并零散的值
    console.log(arr2.concat(1,5,8,23,"yummy"));
    console.log(arr2);  // 最后输出验证了，原数组不会受到影响。

拆分slice(start,end)

从当前数组中截取一个新的数组，不影响原来的数组，返回一个新的数组，包含从 start到end（不包括该元素）的元素。

• 参数区分正负
  • 正值表示下标位置
  • 负值表示从后面往前数第几个位置
  • 参数可以只传递一个，表示从开始位置截取到字符串结尾
• 举例

  /* 拆分 slice(start,end)
       需要注意：区间不包含end -> [start,end)
                参数为负，表示从后往前数
                参数为一个，表示从这个下标位置，一直截取到末尾

    */
    var arr = new Array("desire",5,9,23,56,"haha");
    // 参数正  从前往后数：从0开始
    console.log(arr.slice(2,4)); //  [9,23]
    console.log(arr.slice(2)); // [9,23,56,"haha"]

    //参数负   从后往前数：从1开始
    console.log(arr.slice(-5,-1));  // [5,9,23,56]

    /*  参数无效
        从后往前数第五个位置开始，
        往后并不能找到 -> 从后往前数的第七个位置
        因此截取的数组为空
    */
    console.log(arr.slice(-5,-7));  // []

    /* 当输入的负值超过数组长度，
       它往后截取,可以截取到整个数组
    */
    console.log(arr.slice(-15)); // ["desire",5,9,23,56,"haha"]
    /* 当输入的正值超过数组长度，
       它往后截取,截取到空数组
    */
    console.log(arr.slice(10)); // []
    console.log(arr.slice(10,15)); // []
    
    /*  多次验证后可知，参数位置写的值即使超过数组的下标，
        也不会报错，只会返回空数组
    */ 

• 多次验证后可知，参数位置写的值即使超过数组的下标，也不会报错，只会返回空数组。

删除、插入、替换splice(index,howmany,element1,element2,……)

• 三种方法均会影响到原数组

• 参数：

  • index：删除元素的开始位置
  • howmany：删除元素的个数，可以是0
  • element1,element2：要替换的新的数据。

• 删除,返回删除掉的数组。传前两个参数

  // splice(index,howmany,element1,element2,……)
    var arr = ["desire",5,9,23,56,"haha"];
    
    //删除 -> 会影响原数组  传前两个参数
    console.log(arr.splice(3,2)); // [23,56]
    console.log(arr);  // ["desire",5,9,"haha"]

• 替换，返回替换掉的数组。传三个以上参数

  //替换,传两个以上参数。返回被替换掉的数组。-> 会影响原数组
    console.log(arr.splice(2,3,"lalla")); // [9,23,56]
    console.log(arr); // ["desire",5,"lalla","haha"]

• 插入，返回空数组。传三个及以上的参数，但是第二个参数必须是0

    //插入，第二个参数必须为0，返回空数组。 -> 会影响原数组
    console.log(arr.splice(2,0,"yummy",666,8888)); // []
    console.log(arr); // ["desire",5,9,"yummy",666,8888,23,56,"haha"]

位置方法

• indexof(): 查找数据在数组中最先出现的下标
• lastIndexOf(): 查找数据在数组中最后一次出现的下标
• 注意：如果没有找到返回-1

  var arr = ["desire",5,9,23,"yaya",56,"haha",9,4,2,3,5,"yaya"];
    // 位置方法,参数：需要在数组中查找下标的元素值
    console.log(arr.indexOf("yaya"));  // 4
    console.log(arr.lastIndexOf(9));   // 7
    console.log(arr.indexOf("yummy"));  // -1

倒序reverse()

• reverse()将数组完全颠倒，第一项变成最后一项，最后一项变成第一项。
• 无参数
• 返回值：颠倒后的数组
• 会影响原数组

  console.log(arr.reverse()); //  ["yaya", 5, 3, 2, 4, 9, "haha", 56, "yaya", 23, 9, 5, "desire"]
  console.log(arr); //  ["yaya", 5, 3, 2, 4, 9, "haha", 56, "yaya", 23, 9, 5, "desire"]

排序sort()

• sort() 默认根据字符编码顺序，从小到大排序。
• 如果想要根据数值大小进行排序，必须添加sort的比较函数参数。
• 该函数要比较两个值，然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具备两个参数a和b，根据a和b的关系作为判断条件，返回值根据条件分为三个分支，正数、负数、0.
  • 返回值：负数-1，a排在b前面
  • 返回值：正数1，a排在b后面
  • 返回值：0，a和b的顺序保持不变。
• 注意：
  • 人为能控制的是判断条件。
  • 会影响到原数组
• 举例

  var arr = [1,5,67,87,30,23];
    /* 默认按字符编码顺序排列
    */ 
    console.log(arr.sort()); // [1, 23, 30, 5, 67, 87]
    // 因为其会影响原数组，那么直接输出原数组就可以了。 
    console.log(arr);  // [1, 23, 30, 5, 67, 87]

    // 添加sort的比较函数
    // 测试写的，从大到小排列
    arr.sort(function (a,b){
        if(a > b){
            return -1; //a排在b的前面
        }else if(a < b){
            return 1; // a排在b的后面
        }else {
            return 0; // a和b保持在原来的位置上不动
        }
    });

转字符串方法join()

• 将数组的所有元素连接到一个字符串中。
• join()
  • 参数：通过参数作为连字符将数组中的每一项用连字符连成一个完整的字符串
  • 返回值：字符串
  • 不会影响原数组
• 案例

  var arr = new Array("yummy",5,8,345,67,"HI");
    // 不会影响原数组
    console.log(arr.join("*")); // yummy*5*8*345*67*HI
    // 完全变成字符串
    console.log(arr.join("")); // yummy5834567HI

清空数组

• 方式1：arr = [];
• 方式2：arr.length = 0;
• 方式3：arr.splice(0,arr.length);

String对象

基本包装类型

• 对比：
  • 基本类型的数据：没有属性和方法(但是String可以调用一些属性和方法)
  • 对象数据类型：有属性和方法
• 当调用str.substring()等方法的时候，先把str包装成String类型的临时对象，再调用substring方法，最后销毁临时对象。
• 可以使用new String()构造函数方法创建字符串对象
• 案例

  // 模拟计算机
    var str = "这是一个字符串";
    // 进行一个临时的包装
    var str2 = new String(str);
    // 调用拆分
    var str3 = str2.slice(3,5);
    // 销毁
    str2 = null;
    console.log(str3);

字符串的特点

• 字符串是不可变的
• 由于字符串不可变，在大量拼接字符串的时候会有效率问题。

字符串对象的常用方法

• 字符串所有的方法，都不会修改字符串本身（字符串是不可变的），操作完成会返回一个新的字符串。

字符串属性

• 长度属性：str.length
• 含义：指的是一个字符串中所有的字符总数。

字符串方法

charAt(index)

char(charator字符，at在哪儿)

• 含义：返回指定位置的字符。
• 参数：index字符串的下标（从0开始）
• 返回值：字符

indexof()

• 找到指定的子字符串在原字符串中第一次出现的位置的下标。
• 如果子字符串在原字符串中没有，返回值是 -1

  var str = "这是一个字符串";
  console.log(str.indexOf("字符串")); // 4
  console.log(str.indexOf("字符 串")); // -1

concat()

用于连接两个或多个字符串

• 参数比较灵活，可以是：字符串或者字符串变量、多个字符串
• 生成一个新的字符串，原字符串不会发生变化

  var str = new String("Hi");
  var str1 = str.concat("jack","!","How","are","you","?");
  console.log(str1); // Hijack!Howareyou?

split()

• 方法用于把一个字符串分割成字符串数组。
• 参数：分隔符，利用分割符将字符串分割成多个部分，多个部分作为数组的每一项组成数组。
• 如果分割符是空字符串，相当于将每个字符拆分成数组中的每一项。

  var str = new String("Hijack!");
  var arr = str.split("");
  console.log(arr); // ["H", "i", "j", "a", "c", "k", "!"]

• 返回值：是切分后的数个数组

  var str = new String("Hijack!");
  console.log(str.split("j")); // ["Hi", "ack!"]

• 案例：字符数组可通过join()变成字符串，字符串可通过split()变成字符数组，那么在有些字符串处理不了的情况下，可以将其进行转换，之后再变为字符串即可

    var str = new String("Hijack!");
    // 实现字符串的倒置，字符串中没有直接的倒置函数
    console.log(str.split("").reverse().join(""));

toLowerCase()

• 将所有的英文字符转为小写。
• 生成的是新的字符串，原字符串不发生变化。

toUpperCase()

• 将所有的英文字符转为大写。
• 生成的是新的字符串，原字符串不发生变化。

slice()

同字符数组

• slice(start,end)
• 从开始位置截取到结束位置（不包括结束位置）的字符串。
• 参数区分正负
  • 正值表示下标位置
  • 负值表示从后面往前数第几个位置
  • 参数可以只传递一个，表示从开始位置截取到字符串结尾。

substr()

可在字符串中抽取从start下标开始的指定数目的字符

• 语法：substr(start,howmany)
• start 参数区分正负。正值表示下标位置，负值表示从后往前数第几个位置。
• howmany 参数必须为正数，也可以不写，不写表示从 start 截取到最后。

  var str = new String("Hijack!");
  console.log(str.substr(-5,3)); // jac

substring()

• 方法用于提取字符串中介于两个指定下标之间的字符。
• 语法：substring(start,end)
• 两个参数都是指代下标，两个数字大小不限制，执行方法之前会比较一下两个参数的大小，会用小当做开始位置，大的当做结束位置，从开始位置截取到结束位置但是不包含结束位置。
• 如果不写第二个参数，从开始截取到字符串结尾.

  var str = new String("Hijack!");
  // 先比较两个参数，小的当开始，大的当结束，并且也不包含结束位置
  console.log(str.substring(6,2)); // jack