前端基础-JavaScript标准库对象(内置对象)

第10章 标准库对象(内置对象)

JavaScript 提供了很多个内置对象：Math/Array/Number/String/Boolean…

对象只是带有​属性​和​方法​的特殊数据类型。

我们在学习时其实就是要记住对象的每个属性和方法怎么使用，代表什么含义；

技术问题，遇到分歧，去哪里查找资料：

​​火狐开发者社区–MDN​​

​​微软开发者社区–MSDN​​

10.1 Math对象

​​

​​

10.1.1 常用属性和方法

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

与其它全局对象不同的是, ​​Math​​​ 不是一个构造函数. ​​Math​​ 的所有属性和方法都是静态的.

跟数学相关的运算直接使用Math中的成员即可

console.log(Math.PI); //圆周率3.141592653589793
Math.random();//介于 0 和 1 之间的伪随机数。

Math.ceil(6.6);//获取大于或等于提供数值的最小整数--向上取整
Math.floor(8.8);//获取小于或等于提供数值的最大整数--向下取整
Math.round(9.9);//四舍五入
Math.max(10,20,15);//取多个值中的最大值
Math.min(10,20,15);//取多个值中的最小值
Math.pow(10,2);//返回x的y次幂
Math.sqrt(100);//求平方根

10.1.2 案例

• 求10-20之间的随机数

Math.floor(Math.random() * (max - min)) + min;

10.1.3 属性方法对照表

​Math对象的属性（常量）​

​Math对象的方法（函数）​

10.2 Date对象（构造函数）

​​

​​

10.2.1 常用属性和方法

创建 ​​Date​​ 实例用来处理日期和时间。Date 对象基于1970年1月1日（世界标准时间）起的毫秒数。

// 获取当前时间，UTC世界时间，距1970年1月1日（世界标准时间）起的毫秒数
var now = new Date();
console.log(now.getTime()); // 获取距1970年1月1日（世界标准时间）起的毫秒数
console.log(now.valueOf()); // valueOf用于获取对象的原始值,与getTime()方法相同

Date构造函数的参数
1. 毫秒数 1498099000356    new Date(1498099000356)
2. 日期格式字符串  '2015-5-1'   new Date('2015-5-1')
3. 年、月、日……          new Date(2015, 4, 1)   // 月份从0开始

• 获取日期的毫秒形式

var now = new Date();
console.log(now.getTime());
// valueOf用于获取对象的原始值
console.log(now.valueOf());

// HTML5中提供的方法，有兼容性问题
var now = Date.now();

// 不支持HTML5的浏览器，可以用下面这种方式
var now = + new Date(); // 隐式调用 Date对象的valueOf()

• 日期格式化方法

toString()    // 转换成字符串
valueOf()   // 获取毫秒值
// 下面格式化日期的方法，在不同浏览器可能表现不一致，一般不用
toDateString()
toTimeString()
toLocaleDateString()
toLocaleTimeString()

• 获取日期指定部分

getTime()     // 返回毫秒数和valueOf()结果一样，valueOf()内部调用的getTime()
getSeconds()  // 返回0-59
getMinutes()  // 返回0-59
getHours()    // 返回0-23
getDay()      // 返回星期几 0周日   6周6
getDate()     // 返回当前月的第几天
getMonth()    // 返回月份，***从0开始***
getFullYear() //返回4位的年份  如 2016

10.2.2 案例

• 案例1：写一个函数，格式化日期对象，返回yyyy-MM-dd HH:mm:ss的形式

function formatDate(d) {
  //如果date不是日期对象，返回
  if (!date instanceof Date) {
    return;
  }
  var year = d.getFullYear(),
      month = d.getMonth() + 1, 
      date = d.getDate(), 
      hour = d.getHours(), 
      minute = d.getMinutes(), 
      second = d.getSeconds();
  month = month < 10 ? '0' + month : month;
  date = date < 10 ? '0' + date : date;
  hour = hour < 10 ? '0' + hour : hour;
  minute = minute < 10 ? '0' + minute:minute;
  second = second < 10 ? '0' + second:second;
  return year + '-' + month + '-' + date + ' ' + hour + ':' + minute + ':' + second;
}

• 计算时间差，返回相差的天/时/分/秒

function getInterval(start, end) {
  var day, hour, minute, second, interval;
  interval = end - start;
  interval /= 1000;
  day = Math.round(interval / 60 /60 / 24);
  hour = Math.round(interval / 60 /60 % 24);
  minute = Math.round(interval / 60 % 60);
  second = Math.round(interval % 60);
  return {
    day: day,
    hour: hour,
    minute: minute,
    second: second
  }
}

10.2.3 方法对照表

​Date对象 的方法。​

10.3 Array对象

​​

​​

10.3.1 常用属性和方法

​length属性: 返回数组的成员数量。​

var arr = ['a', 'b'];
console.log(arr.length) // 2

​常用方法​

• • 
    
• push方法用于在数组的末端添加一个或多个元素，并返回添加新元素后的数组长度。注意，该方法会改变原数组。
  ​​var a = []; a.push(1) // 1 a.push('a') // 2 a.push(true, {}) // 4 console.log(a); //[1, 'a', true, {}] ​​
• pop方法用于删除数组的最后一个元素，并返回该元素。注意，该方法会改变原数组
  ​​var a = ['a', 'b', 'c']; a.pop() // 'c' console.log(a);// ['a', 'b'] ​​
• slice方法用于提取原数组的一部分，返回一个新数组，原数组不变。
  它的第一个参数为起始位置(从0开始)，第二个参数为终止位置(但该位置的元素本身不包括在内)。 如果省略第二个参数，则一直返回到原数组的最后一个成员。
  ​​var a = ['a', 'b', 'c']; a.pop() // 'c' console.log(a);// ['a', 'b'] ​​
• join方法用于将数组元素以指定字符拼接为字符串，返回一个字符串，原数组不变。
  ​​var a = ['a','b','c','d','e']; console.log(a.join('-')) // 'a-b-c-d-e' ​​
• 返回数组的字符串表示形式。
  ​​var arr = [1, 2, 3, 4]; console.log(arr.toString()); //1,2,3,4 ​​
  • 
    

10.3.2 方法和属性对照表

​Array 对象的属性。​

​Array 对象的方法。​

10.4 String对象

​​

​​

10.4.1 常用属性和方法

var s = 'JavaScript';
// length属性返回字符串的长度。
var i = s.length; //返回参数在字符串中第一次出现的位置
var i = s.indexOf('b'); //从原字符串取出子字符串并返回，不改变原字符串
var i = s.substr(2,4);//从下标第二个开始截取4个长度的字符串
//toLowerCase方法用于将一个字符串全部转为小写 
//toUpperCase则是全部转为大写
var i = s.toLowerCase();
var i = s.toUpperCase();

// 用于替换匹配的子字符串,只替换第一个匹配 
var i = s.replace('a','b');
console.log(i);

10.4.2 方法和属性对照表

​String 对象的属性。

​String 对象的方法。​

10.5 包装对象

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

所谓“包装对象”，就是分别与数值、字符串、布尔值相对应的​​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

包装对象的最大目的，首先是使得 JavaScript 的对象涵盖所有的值，其次使得原始类型的值可以方便地调用某些方法。

​原始类型的值，可以自动当作对象调用，即调用各种对象的方法和参数。​

**这时，JavaScript 引擎会自动将原始类型的值转为包装对象实例，在使用后立刻销毁实例。**

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

'abc'.length // 3

上面代码中，​​abc​​​是一个字符串，本身不是对象，不能调用​​length​​属性。

JavaScript 引擎自动将其转为包装对象，在这个对象上调用​​length​​属性。

调用结束后，这个临时对象就会被销毁。这就叫原始类型与实例对象的自动转换。

注意：JS的内置对象还有很多，我们只不过是学习了比较常用的几个而已；

在后面的学习中，我们还有讲解使用其他类型的内置对象；

可以查看狐火和微软开发者社区，获取更多知识……