进阶之常用方法大详解（一）

举报
龙哥手记 发表于 2022/09/17 15:07:04 2022/09/17
【摘要】 《JavaScript》系列，第三十篇希望你持续关注哦！

比typeof运算符更准确的类型判断

不同数据类型的Object.prototype.toString方法返回值如下。

  • 数值：返回[object Number]。
  • 字符串：返回[object String]。
  • 布尔值：返回[object Boolean]。
  • undefined：返回[object Undefined]。
  • null：返回[object Null]。
  • 数组：返回[object Array]。
  • arguments 对象：返回[object Arguments]。
  • 函数：返回[object Function]。
  • Error 对象：返回[object Error]。
  • Date 对象：返回[object Date]。
  • RegExp 对象：返回[object RegExp]。
  • 其他对象：返回[object Object]。

这就是说，Object.prototype.toString可以看出一个值到底是什么类型。

Object.prototype.toString.call(2) // "[object Number]"
Object.prototype.toString.call('') // "[object String]"
Object.prototype.toString.call(true) // "[object Boolean]"
Object.prototype.toString.call(undefined) // "[object Undefined]"
Object.prototype.toString.call(null) // "[object Null]"
Object.prototype.toString.call(Math) // "[object Math]"
Object.prototype.toString.call({}) // "[object Object]"
Object.prototype.toString.call([]) // "[object Array]"

利用这个特性，可以写出一个比typeof运算符更准确的类型判断函数。

var type = function (o){
    var s = Object.prototype.toString.call(o)
    return s.match(/\[object (.*?)\]/)[1].toLowerCase()
}
type({}); // "object"
type([]); // "array"
type(5); // "number"
type(null); // "null"
type(); // "undefined"
type(/abcd/); // "regex"
type(new Date()); // "date"

在上面这个type函数的基础上，还可以加上专门判断某种类型数据的方法。

var type = function (o){
  var s = Object.prototype.toString.call(o);
  return s.match(/\[object (.*?)\]/)[1].toLowerCase();
};

['Null',
 'Undefined',
 'Object',
 'Array',
 'String',
 'Number',
 'Boolean',
 'Function',
 'RegExp'
].forEach(function (t) {
  type['is' + t] = function (o) {
    return type(o) === t.toLowerCase();
  };
});

type.isObject({}) // true
type.isNumber(NaN) // true
type.isRegExp(/abc/) // true

Object.prototype.toLocaleString()

Object.prototype.toLocaleString方法与toString的返回结果一模一样的，也是返回一个值的字符串形式。

        var obj = {};
            obj.toString(obj) // "[object Object]"
            obj.toLocaleString(obj) // "[object Object]"

这个方法的主要作用是留出一个接口，让各种不同的对象实现自己版本的toLocaleString，用来返回针对某些地域的特定的值。

    var person = {
          toString: function () {
                     return 'Henry Norman Bethune';
 },
          toLocaleString: function () {
                    return '白求恩';
  }
};

             person.toString() // Henry Norman Bethune
            person.toLocaleString() // 白求恩

上面代码中，toString()方法返回对象的一般字符串形式，toLocaleString()方法它返回本地的字符串形式。

目前，主要有三个对象自定义了toLocaleString方法。

  • Array.prototype.toLocaleString()
  • Number.prototype.toLocaleString()
  • Date.prototype.toLocaleString()

比如来说，日期的实例对象的toString和toLocaleString返回值就不一样，而且toLocaleString的返回值跟用户设定的所在地域相关。

    var date = new Date();
            date.toString() // "Sun Oct 06 2019 15:50:04 GMT+0800 (中国标准时间)"
            date.toLocaleString() // "2019/10/6 下午3:50:04"

filter() 过滤

filter方法用于过滤数组成员，满足条件的成员组成一个新数组返回。

它的参数是一个函数，所有数组成员依次执行该函数，返回结果为true的成员组成一个新数组返回。

该方法不会改变原数组。

            [1,2,3,4,5].filter(function(elem){
                return elem > 3
})
            // [4,5]

上面代码将大于3的数组成员，作为一个新数组返回。

                var arr = [0, 1, 'a', false];

                arr.filter(Boolean)
                // [1, "a"]

上面代码中，filter方法返回数组arr里面所有布尔值为true的成员。

filter方法的参数函数可以接受三个参数*：当前成员，当前位置、整个数组。*

            [1, 2, 3, 4, 5].filter(function (elem, index, arr) { // 当前成员，当前位置、整个数组
                   return index % 2 === 0;
});
            // [1, 3, 5]

上面代码返回偶数位置的成员组成的新数组。

filter方法还可以接受第二个参数，用来绑定参数函数内部的this变量。

            var obj = { MAX: 3 };
            var myFilter = function (item) {
              if (item > this.MAX) return true; // this指向obj
};

             var arr = [2, 8, 3, 4, 1, 3, 2, 9];
             arr.filter(myFilter, obj) // [8, 4, 9]  // 使myFilter内部this指向obj

上面代码中，过滤器myFilter内部有this变量，它可以被filter方法的第二个参数obj绑定，返回大于3的成员。

some()某个，every()每个

这两个方法类似“断言”（assert），返回一个布尔值，表示判断数组成员是否符合某种条件。

它们接受一个函数作为参数，所有数组成员依次执行该函数。该函数接受三个参数：当前成员、当前位置、整个数组，然后返回一个布尔值。

some方法是只要一个成员的返回值是true，则整个some方法的返回值就是true，否则返回false。

            var arr = [1,2,3,4,5]
                arr.some(function(elem,index,arr){ // 返回值中有一个为true则此方法返回true
                return elem >= 3
})
            // true

上面代码中，如果数组arr有一个成员大于等于3，some方法就返回true。

every方法是所有成员的返回值都是true，整个every方法才返回true，否则返回false。

    var arr = [1, 2, 3, 4, 5];
         arr.every(function (elem, index, arr) { // 每个返回值都为true，此方法才返回true，否则返回false
          return elem >= 3;
});
        // false

上面代码中，数组arr并非所有成员大于等于3，所以返回false。

注意，对于空数组，some方法返回false，every方法返回true，回调函数都不会执行。

    function isEven(x) { return x % 2 === 0 } // 不会执行此函数

    [].some(isEven) // false
    [].every(isEven) // true

some和every方法还可以接受第二个参数，用来绑定参数函数内部的this变量。

    var arr = [1,2,3]
    var obj = {MAX:0}

    function fn(elem) {
        return elem > this.MAX // this指向obj
}

    arr.some(fn,obj) // true
    arr.every(fn,obj) // true

reduce() 累计器，reduceRight() 反向累计器

reduce方法和reduceRight方法依次处理数组的每个成员，最终累计为一个值。它们的差别是，reduce是从左到右处理（从第一个成员到最后一个成员），reduceRight则是从右到左（从最后一个成员到第一个成员），其他完全一样。

    [1,2,3,4,5].reduce(function(a,b,c,d){
        // 记住a是默认是第一个成员，然后是上一次运算的返回值。
        console.log(a,b)
           console.log(c)

        return a+b
})
        // 1 2
        // 3 3
        // 6 4
        // 10 5
        // 最终结果 15

上面代码中，reduce方法求出数组所有成员的和。第一次执行，a是数组的第一个成员1，b是数组的第二个成员2。第二次执行，a为上一轮的返回值3，b为第三个成员3。第三次执行，a为上一轮的返回值6，b为第四个成员4。第四次执行，a为上一轮返回值10，b为第五个成员5。至此所有成员遍历完成，整个方法的返回值就是最后一轮的返回值15。

        arr.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])
        // 说明：中括号代表可选参数

reduce方法和reduceRight方法的第一个参数都是一个callback函数。该函数接受以下四个参数。

  1. 累积变量，默认为数组的第一个成员

  2. 当前变量，默认为数组的第二个成员

  3. 当前位置（默认从1开始）, 如果提供了initialValue，则起始索引号为0，否则为1。 （可选）

  4. 原数组（可选）

            `initialValue`可选

作为第一次调用 callback函数时的第一个参数的值。 如果没有提供初始值，则将使用数组中的第一个元素。 在没有初始值的空数组上调用 reduce 将报错。

如果要对累积变量指定初值，可以把它放在reduce方法和reduceRight方法的第二个参数。

            [1, 2, 3, 4, 5].reduce(function (a, b) {

              return a + b;
    }, 10);
    // 25

上面代码指定参数a的初值为10，所以数组从10开始累加，最终结果为25。注意，这时b是从数组的第一个成员开始遍历。

上面的第二个参数相当于设定了默认值，处理空数组时尤其有用。

        function add(prev, cur) {
              return prev + cur;
}

        [].reduce(add) // 报错
        // TypeError: Reduce of empty array with no initial value
        [].reduce(add, 1)
        // 1

上面代码中，由于空数组取不到初始值，reduce方法会报错。这时，加上第二个参数，就能保证总是会返回一个值。

下面是一个reduceRight方法的例子。

        function subtract(prev, cur) {
              return prev - cur;
}

            [3, 2, 1].reduce(subtract) // 0
            [3, 2, 1].reduceRight(subtract) // -4

上面代码中，reduce方法相当于3减去2再减去1，reduceRight方法相当于1减去2再减去3。

应用-找出字符最长的数组成员

由于这两个方法会遍历数组，所以实际上还可以用来做一些遍历相关的操作。比如，找出字符长度最长的数组成员。

function findLongest(entries) {
      return entries.reduce(function (longest, entry) {
        return entry.length > longest.length ? entry : longest;

  }, '');
}

        findLongest(['aaa', 'bb', 'c']) // "aaa"

上面代码中，reduce的参数函数会将字符长度较长的那个数组成员，作为累积值。这导致遍历所有成员之后，累积值就是字符长度最长的那个成员。

应用-按属性对object分类

var people = [
          { name: 'Alice', age: 21 },
          { name: 'Max', age: 20 },
          { name: 'Jane', age: 20 }
];

function groupBy(objectArray, property) {
          return objectArray.reduce(function (acc, obj) {
           var key = obj[property];
            if (!acc[key]) {// 当{}中没有对应分类属性时，先创建改属性

                  acc[key] = [];
    }
                    acc[key].push(obj);
                    return acc;
  }, {}); // 初始值为{}
}

        var groupedPeople = groupBy(people, 'age');
                // groupedPeople is:
            // { 
                //   20: [
                        //     { name: 'Max', age: 20 }, 
                        //     { name: 'Jane', age: 20 }
                //   ], 
                        //   21: [{ name: 'Alice', age: 21 }] 
// }

indexOf() 搜索成员第一个出现的位置，lastIndexOf() 搜索成员最后出现的位置

indexOf方法返回给定元素在数组中第一次出现的位置，如果没有则返回-1。

indexOf语法

        arr.indexOf(searchElement[, fromIndex = 0])
         var a = [1,2,3,4,5]
                a.indexOf(3) // 2   3在数组a中第一次出现的位置为2
                a.indexOf(6) // -1  6在数组a中没有出现，返回-1

indexOf方法还可以接受第二个参数，表示搜索的开始位置。

         ['a', 'b', 'c'].indexOf('a', 1) // -1 从1位置开始搜索a，没有搜索到

上面代码从1号位置开始搜索字符a，结果为-1，表示没有搜索到。 lastIndexOf()语法

         arr.lastIndexOf(searchElement[, fromIndex = arr.length - 1])

lastIndexOf方法返回给定元素在数组中最后一次出现的位置，如果没有则返回-1。

         var a = [2,3,4,2]
                a.lastIndexOf(2) //3   2在数组a中最后一次出现的位置为3
                a.lastIndexOf(5) //-1

注意，这两个方法不能用来搜索NaN的位置，即它们无法确定数组成员是否包含NaN。

         [NaN].indexOf(NaN) // -1
         [NaN].lastIndexOf(NaN) // -1

这是因为这两个方法内部，使用严格相等运算符（===）进行比较，而NaN是唯一一个不等于自身的值。

链式使用

上面这些数组方法之中，有不少返回的还是数组，所以可以链式使用。

    var users = [
          {name: 'tom', email: 'tom@example.com'},
          {name: 'peter', email: 'peter@example.com'}
];

        users
            .map(function (user) {
                  return user.email;
}) // 对每个成员进行遍历，使用返回值组成一个新的数组并返回
            .filter(function (email) { // 过滤返回值为false的成员，并返回一个过滤掉的新数组
                  return /^t/.test(email);
})
            .forEach(function (email) { // 遍历数组
                  console.log(email);
});
            // "tom@example.com"

上面代码中，先产生一个所有 Email 地址组成的数组，然后再过滤出以t开头的 Email 地址，最后将它打印出来。

方法的返回值能满足下一个方法的调用，即可使用链式调用。

四、包装对象

1、定义

对象是JavaScript语言中最主要的数据类型，三种原始类型的值——数字、字符串、布尔值 在一定条件下，也会自动转为对象，也就是原始类型的包装对象（wrapper）

所谓“包装对象”，指的是与数字、字符串、布尔值分别相对应的Number、String、Boolean三个原生对象。这三个原生对象可以把原始类型的值变成（包装成）对象。

        var v1 = new Number(123);
        var v2 = new String('abc');
        var v3 = new Boolean(true);

            typeof v1 // "object"
            typeof v2 // "object"
            typeof v3 // "object"

            v1 === 123 // false
            v2 === 'abc' // false
            v3 === true // false

上面代码中，基于原始类型的值，生成了三个对应的包装对象。可以看到，v1、v2、v3都是对象，且与对应的简单类型值不相等。

包装对象的设计目的，首先是使得“对象”这种类型可以覆盖 JavaScript 所有的值，整门语言有一个通用的数据模型，其次是使得原始类型的值也有办法调用自己的方法。

Number、String和Boolean这三个原生对象，如果不作为构造函数调用（即调用时不加new），而是作为普通函数调用，常常用于将任意类型的值转为数值、字符串和布尔值。

        // 字符串转为数值
        Number('123') // 123

        // 数值转为字符串
        String(123) // "123"

        // 数值转为布尔值
        Boolean(123) // true

上面这种数据类型的转换，详细请见《数据类型转换》一节。

总结一下，这三个对象作为构造函数使用（带有new）时，可以将原始类型的值转为对象；作为普通函数使用时（不带有new），可以将任意类型的值，转为原始类型的值。

2、实例方法

三种包装对象各自提供了许多实例方法，详见后文。这里介绍两种它们共同具有、从Object对象继承的方法：valueOf()和toString()。

2.1 valueOf()

valueOf()方法返回包装对象实例对应的原始类型的值。

            new Number(123).valueOf()  // 123
            new String('abc').valueOf() // "abc"
            new Boolean(true).valueOf() // true

2.2 toString()

toString()方法返回对应的字符串形式。

        new Number(123).toString() // "123"
        new String('abc').toString() // "abc"
        new Boolean(true).toString() // "true"

3、原始类型与实例对象的自动转换

某些场合，原始类型的值会自动当作包装对象调用，即调用包装对象的属性和方法。这时，JavaScript 引擎会自动将原始类型的值转为包装对象实例，并在使用后立刻销毁实例。

比如，字符串可以调用length属性，返回字符串的长度。

        'abc'.length // 3

上面代码中，abc是一个字符串，本身不是对象，不能调用length属性。JavaScript 引擎自动将其转为包装对象，在这个对象上调用length属性。调用结束后，这个临时对象就会被销毁。这就叫原始类型与实例对象的自动转换。

        var str = 'abc';
        str.length // 3

        //等同于
        var strObj = new String(str)
        // String{

    //        0:'a',1:'b',2:'c',length:3,[[PrimitiveValue]]: "abc"
// }

        strObj.length // 3

上面代码中，字符串abc的包装对象提供了多个属性，length只是其中之一。

自动转换生成的包装对象是只读的，无法修改。所以，字符串无法添加新属性。

    var s = 'Hello World';
           s.x = 123;
        s.x // undefined

上面代码为字符串s添加了一个x属性，结果无效，总是返回undefined。

另一方面，调用结束后，包装对象实例会自动销毁。这意味着，下一次调用字符串的属性时，实际是调用一个新生成的对象，而不是上一次调用时生成的那个对象，所以取不到赋值在上一个对象的属性。如果要为字符串添加属性，只有在它的原型对象String.prototype上定义（参见《面向对象编程》章节）。

4、自定义方法

除了原生的实例方法，包装对象还可以自定义方法和属性，供原始类型的值直接调用。

比如，我们可以新增一个double方法，使得字符串和数字翻倍。

    String.prototype.double = function () { // String是一个方法，String.prototype本质是一个实例对象
              return this.valueOf() + this.valueOf();
};

'abc'.double()
// abcabc

         Number.prototype.double = function () {
          return this.valueOf() + this.valueOf();
};

        (123).double() // 246 // 不加括号时点运算符会被解释成小数点

上面代码在String和Number这两个对象的原型上面，分别自定义了一个方法，从而可以在所有实例对象上调用。注意，最后一张的123外面必须要加上圆括号，否则后面的点运算符（.）会被解释成小数点。

5、实例方法

Date的实例对象，有几十个自己的方法，除了valueOf和toString，可以分为以下三类。

  • to类：从Date对象返回一个字符串，表示指定的时间。
  • get类：获取Date对象的日期和时间。
  • set类：设置Date对象的日期和时间。

5.1 Date.prototype.valueOf() 返回时间戳，等同于getTime()。（减法运算默认调用）

valueOf方法返回实例对象距离时间零点（1970年1月1日00:00:00 UTC）对应的毫秒数，该方法等同于getTime方法。

        var d = new Date();

        d.valueOf() // 1362790014817
        d.getTime() // 1362790014817

预期为数值的场合，Date实例会自动调用该方法，所以可以用下面的方法计算时间的间隔。

            var start = new Date();
            // ...
            var end = new Date();
            var elapsed = end - start; // 自动调用valueOf()方法，返回时间戳的减法运算

5.2 to 类方法（返回字符串相关）

（1）Date.prototype.toString() 返回一个完整的日期字符串（直接读取实例默认调用此方法）

toString方法返回一个完整的日期字符串。

            var d = new Date(2013, 0, 1);

            d.toString()

            // "Tue Jan 01 2013 00:00:00 GMT+0800 (CST)"

            // "Tue Jan 01 2013 00:00:00 GMT+0800 (CST)"

因为toString是默认的调用方法，所以如果直接读取Date实例，就相当于调用这个方法。

（2）Date.prototype.toUTCString() 返回对应的UTC时间（世界标准时），比北京时间晚8小时

toUTCString方法返回对应的 UTC 时间，也就是比北京时间晚8个小时。

            var d = new Date(2013, 0, 1);

            d.toUTCString()
            // "Mon, 31 Dec 2012 16:00:00 GMT"

（3）Date.prototype.toISOString() 返回对应时间的 ISO8601 写法（UTC时间）

toISOString方法返回对应时间的 ISO8601 写法。

            var d = new Date(2013, 0, 1);

            d.toISOString()
            // "2012-12-31T16:00:00.000Z"

注意，toISOString方法返回的总是 UTC 时区的时间。

（4）Date.prototype.toJSON() 返回符合JSON格式字符串，与toISOString方法的返回结果完全相同。

toJSON方法返回一个符合 JSON 格式的 ISO 日期字符串，与toISOString方法的返回结果完全相同。

            var d = new Date(2013, 0, 1);

            d.toJSON()
            // "2012-12-31T16:00:00.000Z"

（5）Date.prototype.toDateString() 返回日期字符串（不含时分秒）

toDateString方法返回日期字符串（不含小时、分和秒）。

            var d = new Date(2013, 0, 1);
            d.toDateString() // "Tue Jan 01 2013"

（6）Date.prototype.toTimeString() 返回时间字符串（不含年月日）

toTimeString方法返回时间字符串（不含年月日）。

        var d = new Date(2013, 0, 1);
        d.toTimeString() // "00:00:00 GMT+0800 (CST)"

（7）本地时间

以下三种方法，可以将 Date 实例转为表示本地时间的字符串。

  • Date.prototype.toLocaleString()：完整的本地时间。
  • Date.prototype.toLocaleDateString()：本地日期（不含小时、分和秒）。
  • Date.prototype.toLocaleTimeString()：本地时间（不含年月日）。

下面是用法实例。

        var d = new Date(2013, 0, 1);

            d.toLocaleString()
            // 中文版浏览器为"2013年1月1日 上午12:00:00"
            // 英文版浏览器为"1/1/2013 12:00:00 AM"

            d.toLocaleDateString()
            // 中文版浏览器为"2013年1月1日"
            // 英文版浏览器为"1/1/2013"

            d.toLocaleTimeString()
            // 中文版浏览器为"上午12:00:00"
            // 英文版浏览器为"12:00:00 AM"

这三个方法都有两个可选的参数。

                dateObj.toLocaleString([locales[, options]])
                dateObj.toLocaleDateString([locales[, options]])
                dateObj.toLocaleTimeString([locales[, options]])

这两个参数中，locales是一个指定所用语言的字符串，options是一个配置对象。下面是locales的例子。

                var d = new Date(2013, 0, 1);

                d.toLocaleString('en-US') // "1/1/2013, 12:00:00 AM"
                d.toLocaleString('zh-CN') // "2013/1/1 上午12:00:00"

                d.toLocaleDateString('en-US') // "1/1/2013"
                d.toLocaleDateString('zh-CN') // "2013/1/1"

                d.toLocaleTimeString('en-US') // "12:00:00 AM"
                d.toLocaleTimeString('zh-CN') // "上午12:00:00"

下面是options的例子。

        var d = new Date(2013, 0, 1);

            // 时间格式
            // 下面的设置是，星期和月份为完整文字，年份和日期为数字
            d.toLocaleDateString('en-US', {
                  weekday: 'long',
                  year: 'numeric',
                  month: 'long',
                  day: 'numeric'
})
// "Tuesday, January 1, 2013"

            // 指定时区
            d.toLocaleTimeString('en-US', {
              timeZone: 'UTC',
              timeZoneName: 'short'
})
            // "4:00:00 PM UTC"

            d.toLocaleTimeString('en-US', {
              timeZone: 'Asia/Shanghai',
              timeZoneName: 'long'
})
            // "12:00:00 AM China Standard Time"

            // 小时周期为12还是24
                d.toLocaleTimeString('en-US', {
                      hour12: false
})
            // "00:00:00"

            d.toLocaleTimeString('en-US', {
                  hour12: true
})
            // "12:00:00 AM"

5.3 get类 （获取年、月、日、时、分、秒等）

Date对象提供了一系列get*方法，用来获取实例对象某个方面的值。

  • getTime()：返回实例距离1970年1月1日00:00:00的毫秒数，等同于valueOf方法。（时间戳）
  • getDate()：返回实例对象对应每个月的几号（从1开始）。（日）
  • getDay()：返回星期几，星期日为0，星期一为1，以此类推。（星期）
  • getFullYear()：返回四位的年份。（年）
  • getMonth()：返回月份（0表示1月，11表示12月）。（月）
  • getHours()：返回小时（0-23）。（时）
  • getMilliseconds()：返回毫秒（0-999）。（毫秒）
  • getMinutes()：返回分钟（0-59）。（分）
  • getSeconds()：返回秒（0-59）。（秒）
  • getTimezoneOffset()：返回当前时间与 UTC 的时区差异，以分钟表示，返回结果考虑到了夏令时因素。（与UTC差异）

所有这些get*方法返回的都是整数，不同方法返回值的范围不一样。

  • 分钟和秒：0 到 59
  • 小时：0 到 23
  • 星期：0（星期天）到 6（星期六）
  • 日期：1 到 31
  • 月份：0（一月）到 11（十二月）
var d = new Date('January 6, 2013');

d.getDate() // 6
d.getMonth() // 0
d.getFullYear() // 2013
d.getTimezoneOffset() // -480   UTC时间减去当前时间，单位是分钟

上面代码中，最后一行返回-480，即 UTC 时间减去当前时间，单位是分钟。-480表示 UTC 比当前时间少480分钟，即当前时区比 UTC 早8个小时。

例子：计算本年度还剩下多少天
        function leftDays() {
              var today = new Date();
              var endYear = new Date(today.getFullYear(), 11, 31, 23, 59, 59, 999);
              var msPerDay = 24 * 60 * 60 * 1000; // 一天的毫秒数
              return Math.round((endYear.getTime() - today.getTime()) / msPerDay);
}

上面这些get*方法返回的都是当前时区的时间，Date对象还提供了这些方法对应的 UTC 版本，用来返回 UTC 时间。

获取UTC时区相关方法：

  • getUTCDate()
  • getUTCFullYear()
  • getUTCMonth()
  • getUTCDay()
  • getUTCHours()
  • getUTCMinutes()
  • getUTCSeconds()
  • getUTCMilliseconds()
        var d = new Date('January 6, 2013');

            d.getDate() // 6
            d.getUTCDate() // 5

上面代码中，实例对象d表示当前时区（东八时区）的1月6日0点0分0秒，这个时间对于当前时区来说是1月6日，所以getDate方法返回6，对于 UTC 时区来说是1月5日，所以getUTCDate方法返回5。

5.4 set 类方法

Date对象提供了一系列set*方法，用来设置实例对象的各个方面。

  • setDate(date)：设置实例对象对应的每个月的几号（1-31），返回改变后毫秒时间戳。
  • setFullYear(year [, month, date])：设置四位年份。
  • setHours(hour [, min, sec, ms])：设置小时（0-23）。
  • setMilliseconds()：设置毫秒（0-999）。
  • setMinutes(min [, sec, ms])：设置分钟（0-59）。
  • setMonth(month [, date])：设置月份（0-11）。
  • setSeconds(sec [, ms])：设置秒（0-59）。
  • setTime(milliseconds)：设置毫秒时间戳。

这些方法基本是跟get*方法一一对应的，但是没有setDay方法，因为星期几是计算出来的，而不是设置的。另外，需要注意的是，凡是涉及到设置月份，都是从0开始算的，即0是1月，11是12月。

var d = new Date ('January 6, 2013');

        d // Sun Jan 06 2013 00:00:00 GMT+0800 (CST)
        d.setDate(9) // 1357660800000

        d // Wed Jan 09 2013 00:00:00 GMT+0800 (CST)

set*方法的参数都会自动折算。以setDate为例，如果参数超过当月的最大天数，则向下一个月顺延，如果参数是负数，表示从上个月的最后一天开始减去的天数。

var d1 = new Date('January 6, 2013');

            d1.setDate(32) // 1359648000000
            d1 // Fri Feb 01 2013 00:00:00 GMT+0800 (CST)

var d2 = new Date ('January 6, 2013');

            d.setDate(-1) // 1356796800000
            d // Sun Dec 30 2012 00:00:00 GMT+0800 (CST)

**set类方法和get类方法，可以结合使用，得到相对时间。**

var d = new Date();

        // 将日期向后推1000天
        d.setDate(d.getDate() + 1000);
        // 将时间设为6小时后
        d.setHours(d.getHours() + 6);
        // 将年份设为去年
        d.setFullYear(d.getFullYear() - 1);

set*系列方法除了setTime()，都有对应的 UTC 版本，即设置 UTC 时区的时间。

  • setUTCDate()
  • setUTCFullYear()
  • setUTCHours()
  • setUTCMilliseconds()
  • setUTCMinutes()
  • setUTCMonth()
  • setUTCSeconds()
        var d = new Date('January 6, 2013');
            d.getUTCHours() // 16
            d.setUTCHours(22) // 1357423200000
            d // Sun Jan 06 2013 06:00:00 GMT+0800 (CST)

上面代码中，本地时区（东八时区）的1月6日0点0分，是 UTC 时区的前一天下午16点。设为 UTC 时区的22点以后，就变为本地时区的上午6点。

【版权声明】本文为华为云社区用户原创内容，转载时必须标注文章的来源（华为云社区）、文章链接、文章作者等基本信息， 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容，欢迎发送邮件进行举报，并提供相关证据，一经查实，本社区将立刻删除涉嫌侵权内容，举报邮箱： cloudbbs@huaweicloud.com
HTML JavaScript 数据结构 网站
  • 点赞
  • 收藏
  • 关注作者

评论（0）

0/1000
抱歉，系统识别当前为高风险访问，暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称，即可参与社区互动！

*长度不超过10个汉字或20个英文字符，设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符，设置后3个月内不可修改。

确认 取消

加入云驻计划，成为创作者

  • 华为云周边好礼
  • 免费体验产品
  • 特殊身份标识
  • 线下官方门票
  • 内部专家零距离
  • 与10000+优质创作者共同成长
立即加入