本文主要是介绍JavaScript内置对象，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

JavaScript内置对象

• 1 Math对象
• 2 日期对象
• 3 数组对象
• • 3.1 数组类型检测
  • 3.2 数组的遍历
  • 3.3 添加或删除数组元素
  • 3.4 数组排序
  • 3.5 数组索引
  • 3.6 数组转换为字符串
  • 3.7 其他方法
• 4 字符串对象
• • 4.1 字符串对象的使用
  • 4.2 默认属性
  • 4.3 根据字符返回位置
  • 4.4 根据位置返回字符
  • 4.5 字符串操作方法
• 5 值类型和引用类型

1 Math对象

Math对象用来对数字进行与数学相关的运算，不需要实例化对象，可以直接使用其静态属性和静态方法，Math对象的常用属性和方法如下表。

max()和min()实例：

console.log(Math.max(1, 2, 3, 4, 5));//输出最大值
console.log(Math.min(1, 2, 3, 4, 5));//输出最小值

结果是：
5
1

pow(base, exponent)和sqrt()实例：

console.log(Math.pow(2, 3))//求2的3次方，8
console.log(Math.sqrt(4))//给4开根号，2

结果是：8 2

ceil()和floor()实例：

var m = 3.67;
console.log(Math.ceil(m));//获取大于等于m的最小整数，4
console.log(Math.floor(m));//获取小于等于m的最大整数，3

结果为：4 3

round()实例：

console.log(Math.round(3.45));//求四舍五入的整数值

结果为：3

random()实例：求0-10之间的随机整数

var k = Math.round(Math.random() * 10);//求0-10之间的随机整数
console.log(k);

【案例】猜数字游戏，随机输入一个数字，判断该数字是否和自动生成的数字相同，如果输入的数字大于生成的数字，提示“你猜大了”；反之，提示“你猜小了”，如果输入数字与生成数字相同，提示“猜对了”，并结束代码执行。

function getRandom(min, max) {
    return Math.floor(Math.random() * (max - min + 1) + min);
}
var random = getRandom(1, 10);
while (true) {
    var num = prompt("猜数字，范围在1-10之间");
    if (num > random) {
        alert("你猜大了");
    } else if (num < random) {
        alert("你猜小了");
    } else {
        alert("你猜对了");
        break;
    }
}

2 日期对象

JavaScript中的日期对象需要使用new Date()实例化对象才能使用，Date()是日期对象的构造函数。

Date()构造函数可以传入一些参数，示例代码如下：

// 方式1：没有参数
var date1 = new Date();
// 方式2：传入年、月、日、时、分、秒（月的范围是0~11）
var date2 = new Date(2021, 11, 19, 19, 46, 56);
// 方式3：用字符串表示日期和时间
var date3 = new Date('2019-10-16 10:57:56');

日期对象常用的get方法：

示例：

var date1 = new Date();//实例化对象
console.log("今年是" + date1.getFullYear() + "年");//输出年份
console.log("本月是第" + (date1.getMonth() + 1) + "月");//输出月份
console.log("今天是本月第" + date1.getDate() + "天");//输出本月第几天
console.log("今天是星期" + (date1.getDay()));//输出星期
console.log("现在是"+date1.getHours()+"时");//输出小时数
console.log("现在是"+date1.getMinutes()+"分");//输出分钟数
console.log("现在是"+date1.getSeconds()+"秒");//输出秒数
console.log("现在是"+date1.getMilliseconds()+"毫秒");//输出毫秒数
console.log(date1.getTime());//输出从1970-01-01 00:00:00距离Date对象所代表时间的毫秒数

日期对象的常用的set方法：

其他方法：

示例：

var d = new Date();
console.log(d.toJSON());
console.log(d.toDateString());
console.log(d.toLocaleDateString());

【案例】“三天打鱼，两天晒网”
假定2008-08-08是第一天晒网，请问今天是打鱼还是晒网？

var d1 = new Date(2008 - 08 - 08);
var d2 = new Date();
var s = d2.getTime() - d1.getTime();//得到今天距离2008年8月8日的毫秒数
var m = parseInt(s / 1000 / 3600 / 24);//得到今天距离2008年8月8日的天数
switch (m % 5) {
    case 0://第0天是打鱼第一天
    case 1: console.log("今天打鱼"); break;
    case 2:
    case 3:
    case 4: console.log("今天晒网"); break;
}

3 数组对象

3.1 数组类型检测

(1)数组类型检测的方法：
数组类型检测有两种常用的方式，分别是使用instanceof运算符和使用Array.isArray()方法。

var arr = [];
var obj = {};
// 第1种方式
console.log(arr instanceof Array);	// 输出结果：true
console.log(obj instanceof Array);	// 输出结果：false
// 第2种方式
console.log(Array.isArray(arr));	// 输出结果：true
console.log(Array.isArray(obj));	// 输出结果：false

3.2 数组的遍历

假设arr为一个数组：

1、使用for循环遍历

for (var i = 0; i < arr.length; i++) {
    console.log(arr[i]);
}

2、使用for…in遍历

for (var i in arr) {
    console.log(arr[i]);
}

3、使用for…of遍历

for (var i of arr) {
    console.log(i);
}

4、使用forEach遍历

arr.forEach(function (t) {
    console.log(t);
})

5、使用map遍历

arr.map(function (t) {
    console.log(t);
})

3.3 添加或删除数组元素

JavaScript数组对象提供了添加或删除元素的方法，可以实现在数组的末尾或开头添加新的数组元素，或在数组的末尾或开头移出数组元素。方法如下：

示例：

var arr = [2, 5, 7, 9, 3];
console.log(arr.push(1));//在数组末尾添加一个数，返回值为数组长度
console.log(arr);//输出该数组

结果是：
6
[ 2, 5, 7, 9, 3, 1 ]

var arr = [2, 5, 7, 9, 3];
console.log(arr.unshift(1));//在数组开头添加一个数，返回值为数组长度
console.log(arr);//输出该数组

结果是：
6
[ 1, 2, 5, 7, 9, 3 ]

var arr = [2, 5, 7, 9, 3];
console.log(arr.pop());//输出并删除数组的最后一个元素
console.log(arr);//输出该数组

结果是：
3
[ 2, 5, 7, 9 ]

var arr = [2, 5, 7, 9, 3];
console.log(arr.shift());//输出并删除数组的第一个元素
console.log(arr);//输出该数组

结果是：
2
[ 5, 7, 9, 3 ]

【案例】筛选数组
要求在包含工资的数组中，剔除工资达到2000或以上的数据，把小于2000的数重新放到新的数组里面。

var arr = [1500, 1200, 2000, 2100, 1800];
var newArr = [];//定义一个新数组用来存放2000以下的工资
for (var i = 0; i < arr.length; i++) {//便利该数组
    if (arr[i] < 2000) {//如果遍历到某个数小于2000
        newArr.push(arr[i]);//把这个数添加到新数组中
    }
}
console.log(newArr);//输出新数组

结果是：[ 1500, 1200, 1800 ]

3.4 数组排序

JavaScript数组对象提供了数组排序的方法，可以实现数组元素排序或者颠倒数组元素的顺序等。排序方法如下：

实例：

var arr = [4, 6, 8, 32, 2, 7, 9];
console.log(arr.sort());

结果是：[ 2, 32, 4, 6, 7, 8, 9 ]

var arr = [4, 6, 8, 32, 2, 7, 9];
console.log(arr.reverse());

结果是：[ 9, 7, 2, 32, 8, 6, 4 ]

3.5 数组索引

在开发中，若要查找指定的元素在数组中的位置，可以利用Array对象提供的检索方法。检索方法如下：

注意：默认都是从指定数组索引的位置开始检索，并且检索方式与运算符“===”相同，即只有全等时才会返回比较成功的结果。

示例：

var arr = [45, 67, 8, 23, 67, 9, 67];
console.log(arr.indexOf(67));//返回67所在位置的第一个索引
console.log(arr.lastIndexOf(67));//返回67所在位置的最后一个索引

结果为：1 6

【案例】数组去除重复元素
案例需求：要求在一组数据中，去除重复的元素。

function unique(arr) {
    var newArr = [];//设置一个空数组存放不重复的数字
    for (var i = 0; i < arr.length; i++) {//遍历传入的数组
        if (newArr.indexOf(arr[i]) === -1) {//如果新数组中没有遍历到的数字，即索引为-1
            newArr.push(arr[i]);//将这个数字添加到新数组中
        }
    }
    return newArr;//返回新数组
}
var arr = [45, 67, 8, 23, 67, 9, 67];
console.log(unique(arr));

结果为：[ 45, 67, 8, 23, 9 ]

3.6 数组转换为字符串

在开发中，可以利用数组对象的join()和toString()方法，将数组转换为字符串。方法如下：

示例：

// 使用toString()
var arr = ['a', 'b', 'c'];
console.log(arr.toString());// 输出结果：a,b,c
// 使用join()
console.log(arr.join());// 输出结果：a,b,c
console.log(arr.join(''));// 输出结果：abc
console.log(arr.join('-'));// 输出结果：a-b-c

结果为：
a,b,c
a,b,c
abc
a-b-c

3.7 其他方法

JavaScript还提供了很多其他常用的数组方法。例如，填充数组、连接数组、截取数组元素等。方法如下：

注意：slice()和concat()方法在执行后返回一个新的数组，不会对原数组产生影响，剩余的方法在执行后皆会对原数组产生影响。

示例：

var arr = [1, 2, 3, 4];
console.log(arr.fill(0, 2, 4));//从2到4填充为0

结果为：[ 1, 2, 0, 0 ]

var arr = [1, 2, 3, 4, 5, 6, 7, 8];
console.log(arr.splice(2, 4));//删除从第2个开始（不包括2）后的4个数
console.log(arr);//输出删除数字后的数组

结果为：
[ 3, 4, 5, 6 ]
[ 1, 2, 7, 8 ]

var arr = [1, 2, 3, 4, 5, 6, 7, 8];
console.log(arr.slice(2, 5));//截取从2（不包括2）到5开始的数组

结果为：[ 3, 4, 5 ]

var arr1 = [1, 2, 3, 4];
var arr2 = [9, 8, 7, 6];
console.log(arr1.concat(arr2));

结果为：[ 1, 2, 3, 4, 9, 8, 7, 6 ]

4 字符串对象

4.1 字符串对象的使用

1、直接创建

var 变量名 = "字符串";

2、通过String对象创建

var 变量名 = new String("字符串");

4.2 默认属性

字符串默认的属性：length，用来记录字符串的长度，使用方式：

字符串变量名.length

示例：

var str = new String("橘猫吃不胖");
console.log(str.length);

结果是5

4.3 根据字符返回位置

字符串对象提供了用于检索元素的属性和方法，字符串对象的常用属性和方法如下：

示例：

var str = new String("橘猫吃不胖");
console.log(str.indexOf("不"));

结果是3

var str = new String("橘猫吃不胖");
console.log(str.indexOf("不1"));

结果是-1

如果结果是-1，表明未找到value

var str = new String("橘猫吃不胖橘猫吃不胖");
console.log(str.lastIndexOf("吃"));

结果是7

【案例】要求在一组字符串中，找到所有指定元素出现的位置以及次数。字符串为 ’ Hello World, Hello JavaScript '。

var str = "Hello World!Hello JavaScript!";
var index = str.indexOf("o");//找到o第一次出现的位置
var num = 0;//定义一个计数器num为0
while (index != -1) {
    console.log(index);//
    index = str.indexOf("o", index + 1);//继续找下一个o
    num++;
}
console.log("出现的次数", num);

4.4 根据位置返回字符

字符串对象提供了用于获取字符串中的某一个字符的方法。方法如下：

常用的ASCII如下：

示例：

var str = "Hello World!Hello JavaScript!";
console.log(str.charAt("9"));

结果是：l

var str = "Hello World!Hello JavaScript!";
console.log(str.charCodeAt(9))

108
【案例】统计出现最多的字符和次数

var str = "Apple";
var o = {};//定义一个空对象
for (var i = 0; i < str.length; i++) {
    var chars = str.charAt(i);//获取i位置的字符，并赋值给chars
    if (o[chars]) {//表示对象o中存在chars
        o[chars]++;
    } else {
        o[chars] = 1;
    }
}
console.log(o);

结果为：{ A: 1, p: 2, l: 1, e: 1 }

4.5 字符串操作方法

字符串对象提供了一些用于截取字符串、连接字符串、替换字符串的属性和方法。字符串对象的常用属性和方法如下：

concat示例：

var s1 = "abc";
var s2 = "def";
var s3 = "123";
console.log(s1.concat(s2, s3));

结果为：abcdef123

slice示例：

var str="javascript程序设计";
console.log(str.slice(4));//截取从索引为4到串末尾的字符
console.log(str.slice(4, 9));//截取4至9之间的字符
console.log(str.slice(-5,-3));

script程序设计
scrip
t程

substr示例：

var str = "javascript程序设计";
console.log(str.substr(0,10));

javascript

toLowerCase()示例：

var str = "Javascript程序设计";
console.log(str.toLowerCase());

javascript程序设计

toUpperCase()示例：

var str = "javascript程序设计";
console.log(str.toUpperCase());

JAVASCRIPT程序设计

split()示例：

var phone = "135-1234-5678";
var arr = phone.split("-");
arr.forEach(elem => {
    console.log(elem);
})

replace示例：

var str = "javascript程序设计";
console.log(str.replace("java", "Action"));

Actionscript程序设计

【案例】判断用户名是否合法。用户名长度在3~10范围内，不能出现敏感词admin的任何大小写形式。

var username = prompt("请输入用户名");
if (username.length < 3 || username.length > 10) {
    alert("用户名的长度在3~10之间");
} else if (username.toLowerCase().indexOf("admin") !== -1) {
    alert("用户名中不能包含敏感词：admin");
} else {
    alert("用户名合法");
}

5 值类型和引用类型

在JavaScript中，简单数据类型（如字符串型、数字型、布尔型、undefined、null）又称为值类型，复杂数据类型（对象）又称为引用类型。

引用类型的特点是，变量中保存的仅仅是一个引用的地址，当对变量进行赋值时，并不是将对象复制了一份，而是将两个变量指向了同一个对象的引用。

示例：

// 创建一个对象，并通过变量obj1保存对象的引用
var obj1 = { name: '小明', age: 18 };
// 此时并没有复制对象，而是obj2和obj1两个变量引用了同一个对象
var obj2 = obj1;
// 比较两个变量是否引用同一个对象
console.log(obj2 === obj1);  // 输出结果：true
// 通过obj2修改对象的属性
obj2.name = '小红';
// 通过obj1访问对象的name属性
console.log(obj1.name);	    // 输出结果：小红

结果为：
true
小红

上述代码运行后，obj1和obj2两个变量引用了同一个对象，此时，无论是使用obj1操作对象还是使用obj2操作对象，实际操作的都是同一个对象。如下图：

当obj1和obj2两个变量指向了同一个对象后，如果给其中一个变量（如obj1）重新赋值为其他对象，或者重新赋值为其他值，则obj1将不再引用原来的对象，但obj2仍然在引用原来的对象。

var obj1 = { name: '小明', age: 18 };
var obj2 = obj1;
// obj1指向了一个新创建的对象
obj1 = { name: '小红', age: 17 };
// obj2仍然指向原来的对象
console.log(obj2.name);	 // 输出结果：小明

结果为：小明

注意：
当一个对象只被一个变量引用的时候，如果这个变量又被重新赋值，则该对象就会变成没有任何变量引用的情况，这时候就会由JavaScript的垃圾回收机制自动释放。

如果在函数的参数中修改对象的属性或方法，则在函数外面通过引用这个对象的变量访问时的结果也是修改后的。

function change(obj) {
    obj.name = '小红';	// 在函数内修改了对象的属性
}
var stu = { name: '小明', age: 18 };
change(stu);
console.log(stu.name);	// 输出结果：小红

结果是：小红

这篇关于JavaScript内置对象的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！