MaiMai

js内置对象

  • ~7.62K 字

内置对象

  • js中的对象分为3种：自定义对象、内置对象、浏览器对象
  • 前面的两种对象时js基础内容 属于ecmascript 第三个浏览器对象属于我们js独有的 我们js api讲解

查文档

  1. MDN MDN

Math对象

Math 是一个内置对象，它拥有一些数学常数属性和数学函数方法。Math 不是一个函数对象


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<script>
    // 1. 绝对值方法
    console.log(Math.abs(1));  //1
    console.log(Math.abs(-1));  ///1
    console.log(Math.abs('-1')); //1
    console.log(Math.abs('pink')); //NaN

    // 2. 三个取整方法
        // (1) Math.floor() 向下取整 往最小了 取值
        console.log(Math.floor(1.2));
        console.log(Math.floor(1.8));
        // (2) Math.ceil() 向上取整  往最大了 取值

        console.log(Math.ceil(1.2));
        console.log(Math.ceil(1.9));
        // (3)  Math.round() 四舍五入 其他数字都是四舍五入  但是 .5特殊 它往大了取
        console.log(Math.round(1.4));
        console.log(Math.round(1.8));
        console.log(Math.round(-1.2));
        console.log(Math.round(-1.5));
</script>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
console.log(Math.random());
      // Math.random()返回的是 一个随机的小数  [0,1)

      // 得到2个数之间的随机数

     function getRandom(min, max) {
          min = Math.ceil(min);
          max = Math.floor(max);
          return Math.floor(Math.random() * (max - min)) + min; //不含最大值，含最小值
      }

      console.log(getRandom(1,10));

      // 随机点名
      var arr = ['小花','小明','小欧'];
      console.log(arr[getRandom(0,arr.length-1)]);
  </script>

日期对象

Date概述

  • Date对象和Math对象不一样， 它是一个构造函数，所以我们需要实例化后才能使用
  • Date实例用来处理日期和时间
1
2
3
4
5
6
7
8
9
10
<script>
       // Date() 日期对象  是一个构造函数  必须用new 来调试我们的日期对象
       var date = new Date();
       console.log(date);

       var date1 = new Date(2019,1,2);
       console.log(date1);
       var date2 = new Date(2019-10-1);
       console.log(date2);
   </script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<script>
    function conutDown(time){
        var nowTime = + new Date();//返回的是当前时间总的毫秒数
        var inputTime = +new Date(time);// 返回的是用户输入时间总的毫秒数
        var times = (inputTime - nowTime)/1000;// times 是剩余时间总的秒数

        d = parseInt(times/60/60/24); //计算天数
        d = d<10 ? '0' + d : d;
        h = parseInt(times/60/60%24); //计算小时
        h = h<10 ? '0' + h : h;
        m = parseInt(times / 60 %60); //计算分钟
        m = m<10 ? '0' + m : m;
        s = parseInt(times%60); //计算当前秒数
        s = s<10 ? '0' + s : s;
        return d +'天'+ h + '时' + m + '分' + s + '秒';
    }
    console.log(conutDown('2022-5-7 18:00:00'));

    var nowTimes = new Date();
    console.log(nowTimes);
</script>

数组对象

  1. 利用数组字面量
  2. 利用new Array（）
1
2
3
4
5
6
7
8
9
10
11
12
13
<script>
    // 创建数组的两种方式
        // 1.利用数组字面量
        var arr = [1,3,54,3]
        console.log(arr[0]);

    //  利用new Array()
    var arr1 = new  Array()  //创建了一个空的数组  
    var arr2= new Array(4)  //创建一个 长度为4的数组

    var arr3 = new Array(3,65,65,65)   //等价于[3,65,65,65] 这样写表示里面有2个数组元素 是3,65,65,65
    console.log(arr1,arr2,arr3);
</script>

  1. 检查是否为数组的方法
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<script>
    //翻转数组
    function reverse(arr){
        var newArr = [];
        for (var i = arr.length -1 ;i>=0;i--){
                newArr[newArr.length] = arr[i]
        }
        return newArr;
    }

    var arr =  new Array(1,54,46,65);
    console.log(reverse(arr));
    var obj = new Object;
    obj.name = 'dfhak';
    obj.sex = '男';
    console.log(obj);
     


    //1.检查是否为数组   instanceof
    console.log(arr instanceof Array);
    console.log(obj instanceof Array);

    //2. Array.isArray(参数)
    console.log(Array.isArray(arr));
    console.log(Array.isArray(obj));
</script>

  1. 增加删除数组元素的方法
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    <script>
        //添加数组元素的方法
        // push() 在我们数组的末尾添加一个或者多个数组元素  push 推
        var arr = [1,34,3,5,35,5];
        arr.push(1,1,1,1,1,1,99,9);
        console.log(arr);  //等价于console.log(arr.push((1,1,1,1,1,1))
        // 1. push 是可以给数组追加新的元素
        // 2. push（）参数直接写  数组元素就可以
        // 3. push 完毕之后  返回的 结果是  欣数组的长度
        // 4. 原数组也会发生变化

        //unshift()
        var arr1 = [1,34,3,5,35,5];
        console.log(arr1.unshift('re','3434'));
        console.log(arr1);
        // unshift是可以给数组前面追加新的元素
        // unshift()参数直接写  数组元素就可以了
        // unshift 完毕之后 返回的结果是  新数组的长度
        // 原数组也会发生变化

        
        
        
        // pop() 可以删除数组的最后一个元素  一次只能删除一个
        // pop()没有参数
        // pop完毕之后 返回的结果是 删除的那个元素
        // 元素数组也会发生变化
        console.log(arr.pop());

        
        
         // shift 可以删除数组的第一个元素  
        // shift()没有参数
        // shift完毕之后 返回的结果是 删除的那个元素
        // 元素数组也会发生变化
        
        console.log(arr1.shift());

    </script>

  1. 数组排序

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    <script>
        // 数组排序
        var arr = [1,43,5,46,57,687,98,0,7];
            // 翻转数组
        arr.reverse()
        console.log(arr);

            // 冒泡排序
        arr.sort(function(a,b){
            //   return a-b; // 正序
              return b-a; //倒叙
        })

        console.log(arr);
    </script>

  2. 数组索引方法

1
2
3
4
5
6
7
8
9
10
11
12
<script>

    // 返回数组元素索引号的方法 indexOf(数组元素)  作用是返回该数组元素的索引号 从前面开始查找
    // 它只返回一个满足条件的索引号
    // 如果找不到元素 则返回-1
    var arr = [1,3,5,6,7,8,9,9];
    console.log(arr.indexOf(7));

    // 返回数组元素索引号的方法 lastIndexOf(数组元素) 作用是返回该数组元素的索引号 从后面开始查找
    console.log(arr.lastIndexOf(7));

</script>

方法名 说明 返回值
concat() 链接两个或多个数组，不影响原数组 返回一个新的数组
slice() 数组截取slice(begin,end) 返回被截取项目的新数组
splice() 数组删除splice(第几个开始，要删除个数) 返回被删除项目的新数组 注意，这个会影响原数组

字符串对象

  1. 基本包装类型

为了方便操作基本数据类型，js还提供了三个特殊的引用类型，String，Number，Boolean

基本包装类型就是把简单的数据类型包装成为复杂的数据类型

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script>
     // 基本包装类型
     var str = 'study';
     console.log(str.length);

     // 对象  才有 属性 和方法  复杂数据类型才有属性和方法

     // 基本包装类型，  就是把简单数据类型  包装成为了复杂数据类型
         // 把简单数据类型包装为复杂数据类型
         var temp = new String('study');
             // 把临时变量的值 给str
         str= temp;
         // 销毁这个临时变量
         temp = null;
         console.log(str);
 </script>
  1. 字符串不可变

指的是里面的值不可变，虽然看上去可以改变内容，但其实是地址变了，内存中开辟了新的空间

  1. 根据字符返回位置

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

    方法名 说明
    indexOf(‘要查找的字符’,开始的位置) 返回指定内容在元字符串中的位置 如果找不到就返回-1，开始的位置是index的索引号
    lastIndexOf（） 从后往前找，只找第一个匹配的 
1
2
3
4
5
6
7
8
9
<script>
    // 字符串对象  根据字符返回位置 str.indexOf('要查找的字符',[起始的位置])
    var str = '我自去横刀向天笑，去留肝胆两昆仑';
    console.log(str.indexOf('去'));
    console.log(str.indexOf('去' ,2));

    console.log(str.lastIndexOf('去'));

</script>
  1. 根据位置返回字符（*）

方法名 说明 使用
charAt(index) 返回指定位置的字符(index 字符串的索引号) str.charAt(0)
charCodeAt(index) 获取指定位置处字符的ASVLL码(index索引号) str.charCodeAt(0)
str[index] 获取指定位置处字符 HTML5，IE8+支持和charAt()等效

字符串操作方法

方法名 说明
concat(str1,str2,str3) concat()方法用于连续两个或者多个字符串。拼接字符串，等效于+ + 更常用
substr(start,length) 从start位置开始（索引号），length取的个数重点记住这个
slice(start,end) 从start位置开始 截取到end位置 end取不到（他们两都是索引号）
substring(start,end) 从start位置开始，截取到end位置end取不到 基本和slice 相同但是不接受负值

其他方法

方法名 说明
replace() 替换字符replace（’被替换的字符’,’替换为的字符’）他只会替换第一个字符
split() 字符串转换为数组split(‘分隔符’) 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<script>
    // 替换字符replace（'被替换的字符','替换为的字符'）他只会替换第一个字符
    var str = 'helloworld';
    console.log(str.replace('he','ss'));
    var str1 = 'qwertyuqwertyqwerty';
    //将str1 中所有的q 转换为 *
    while(str1.indexOf('q') !==-1){
        str1 = str1.replace('q','*')
    }
    console.log(str1);
    // 字符串转换为数组split('分隔符')
    var str2 = "'red','blue','black'"
    console.log(str2.split(','));

    var str3 = "red&blue&black";
    console.log(str3.split('&'));
    // join将数组转换为字符串
    var arr = [1,2,4,5,6,7,8];
    console.log(arr.join());
</script>
本作品采用 知识共享署名-相同方式共享 4.0 国际许可协议 进行许可