内置对象

一、什么是内置对象
二、Math对象
- 三种取整方法
- 随机数方法 random()
- 猜数字游戏
三、日期对象
- 日期格式化
- 倒计时案例
四、数组对象
- 数组去重【重点】
五、字符串对象
- 根据字符返回位置
- 根据位置返回字符【重点】
- 字符串的操作方法【重点】
六、简单数据类型和复杂数据类型
- 堆和栈

一、什么是内置对象

JavaScript中的对象分为3种：自定义对象、内置对象、浏览器对象，其中前两种是JS基础内容，属于ECMAScript，浏览器对象是JS独有的。

内置对象就是JS语言自带的供开发者使用的对象，提供了一些常用的或是最基本而必要的功能。

二、Math对象

Math对象不是一个构造函数，不需要用new来调用，而是直接使用里面的属性和方法。

Math属性可参见MDN

Math.PI 表示一个圆的周长与直径的比例，Math.PI=π≈3.14159
Math.max() 函数返回一组数中的最大值，如果给定的参数中至少有一个参数无法被转换成数字，则会返回 NaN。如果没有参数，则结果为 - Infinity（负无穷）

console.log(Math.max(-1, -3, -2));

arguments是一个类数组对象，包含着传入函数中的所有参数。
使用arguments对象在函数中引用函数的参数。此对象包含传递给函数的每个参数，第一个参数在索引0处。

// 利用对象封装自己的数学对象，里面有PI 最大值和最小值
var myMath = {PI: 3.141592653,max: function () {// arguments接收传递过来的所有实参var max = arguments[0];for (var i = 1; i < arguments.length; i++) {if (arguments[i] > max) {max = arguments[i];}}return max;},min: function () {var min = arguments[0];for (var i = 1; i < arguments.length; i++) {if (arguments[i] < min) {min = arguments[i];}}return min;}
}
console.log(myMath.PI);
console.log(myMath.max(1, 5, 9));
console.log(myMath.min(1, 5, 9));

Math.abs()取绝对值

存在隐式转换，会把字符串型的-1转换成数字型

// 绝对值
console.log(Math.abs(1));   //1
console.log(Math.abs(1));   //1
console.log(Math.abs('-1')); //1  存在隐式转换，会把字符串型的-1转换成数字型
console.log(Math.abs('Elsie'));  // NAN

三种取整方法

Math.floor() 向下取整

// Math.floor 向下取整
console.log(Math.floor(1.1)); //1
console.log(Math.floor(1.9)); //1

Math.ceil() 向上取整

// Math.ceil 向上取整
console.log(Math.ceil(1.1)); //2
console.log(Math.ceil(1.9)); //2

Math.round() 其他数字都是四舍五入，但是**.5特殊**，它往大了取（正数、负数均取更大的）

// Math.round()
console.log(Math.round(1.1)); //1
console.log(Math.round(1.5)); //2
console.log(Math.round(1.9)); //2
console.log(Math.round(-1.1)); //-1
console.log(Math.round(-1.5)); //-1

随机数方法 random()

Math.random()方法返回一个随机的浮点数, 伪随机数范围**[0，1)**，这个方法里面不跟参数

// 随机数random
console.log(Math.random());
// 得到两数之间的随机数
function getRandomArbitrary(min, max) {return Math.random() * (max - min) + min;
}
// 得到两数之间的随机整数
function getRandomInt(min, max) {min = Math.ceil(min);max = Math.floor(max);return Math.floor(Math.random() * (max - min)) + min; //不含最大值，含最小值
}
// 得到两数之间的随机整数，包括两数在内
function getRandomIntInclusive(min, max) {min = Math.ceil(min);max = Math.floor(max);return Math.floor(Math.random() * (max - min + 1)) + min; //含最大值，含最小值
}

// 随机点名
var arr = ['yz', 'zwy', 'tjc', 'dw', 'why'];
console.log(arr[getRandomIntInclusive(0, arr.length - 1)]);

猜数字游戏

程序随机生成一个1—10之间的数字，并让用户输入一个数字，没猜对就提示是猜大了还是猜小了用户继续猜，猜对了就结束程序

思路：

调用Math.random()方法随机生成1—10的整数
采用while循环
core：使用if else if多分支语句判断大于、小于、等于

// 猜数字游戏
function getRandomIntInclusive(min, max) {min = Math.ceil(min);max = Math.floor(max);return Math.floor(Math.random() * (max - min + 1)) + min; //含最大值，含最小值
}
var random = getRandomIntInclusive(1, 10);
while (true) {//死循环var num = prompt('你来猜？输入1-10之间的一个数字');if (num > random) {alert('你猜大了');}else if (num < random) {alert('你猜小了');}else {alert('恭喜你！猜对啦！');break;//退出整个循环，程序结束}
}

三、日期对象

Date()日期对象是一个构造函数，创建一个新Date对象的唯一方法是通过new 操作符。

如果没有参数，返回当前系统的当前时间
参数常用的写法：数字型：2022，4，1 或者是字符串型：’2022-4-1 8：8：8‘

// Date()
var date = new Date();
console.log(date);
// 数字型
var date1 = new Date(2022, 4, 1);//返回的是11月
console.log(date1);
// 字符串型
var date1 = new Date('2022-4-1 8:8:8');
console.log(date1);

日期格式化

例如，getFullYear() 方法根据本地时间返回指定日期的年份。

格式化年月日

// 格式化日期：年月日 返回当前系统的日期
var date = new Date();
console.log(date.getFullYear()); //返回当前日期的年 2022
console.log(date.getMonth() + 1); //月份4 返回的是3所以需要加一
console.log(date.getDate());//返回的是 几号
console.log(date.getDay());//周一返回的是1 周六是6 周日是0
// 例 2022年4月1日 星期五
var year = date.getFullYear();
var month = date.getMonth() + 1;
var dates = date.getDate();
var day = date.getDay();
// 用数组来对应展示中文的星期几
var arr = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
console.log('今天是：' + year + '年' + month + '月' + dates + '日' + arr[day]);

格式化时分秒

// 格式化日期 时分秒
var date = new Date();
console.log(date.getHours()); //时
console.log(date.getMinutes());//分
console.log(date.getSeconds());//秒

要求封装一个函数返回当前的时分秒

// 要求封装一个函数返回当前的时分秒，格式08：08：08
function getTime() {var time = new Date();var h = time.getHours();var m = time.getMinutes();var s = time.getSeconds();// 三元运算符给小于十的秒数前面加0h = h < 10 ? '0' + h : h;m = m < 10 ? '0' + m : m;s = s < 10 ? '0' + s : s;return h + ':' + m + ':' + s
}
console.log(getTime());

获取日期的总的毫秒形式（距1970-1-1）

Date对象是基于返回自 1970-1-1 00:00:00 UTC（世界标准时间）至今所经过的毫秒数。

// 获得Date总的毫秒数（时间戳）
// method1：valueOf() getTime()
var date = new Date();
console.log(date.valueOf()); //现在距离1970.1.1总的毫秒数
console.log(date.getTime());
// method2 最常用的写法
var date1 = + new Date(); //+new Date()返回的就是总的毫秒数
console.log(date1);
// method3 H5新增的方法
console.log(Date.now());

倒计时案例

算法分析：

输入的时间减去现在的时间得到剩余的时间（倒计时），不能用时分秒直接相减可能出现负数。
利用时间戳进行计算：将来的时间戳 - 现在的时间戳 = 剩余时间毫秒数
将剩余时间总毫秒数转换为天时分秒

// 倒计时案例 例如京东秒杀
function countDown(time) {var futureTime = + new Date(time);//用户输入时间总毫秒数var nowTime = + new Date();//当前时间总毫秒数var times = (futureTime - nowTime) / 1000;//剩余时间总秒数times = times < 10 ? '0' + times : times;var seconds = parseInt(times % 60);seconds = seconds < 10 ? '0' + seconds : seconds;var minutes = parseInt(times / 60 % 60);minutes = minutes < 10 ? '0' + minutes : minutes;var hours = parseInt(times / 60 / 60 % 24);hours = hours < 10 ? '0' + hours : hours;var days = parseInt(times / 60 / 60 / 24);days = days < 10 ? '0' + days : days;return days + '天' + hours + '时' + minutes + '分' + seconds + '秒';
}
console.log(countDown('2022-5-1 18:00:00'));

四、数组对象

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

// 创建数组的两种方式
// 1. 利用数组字面量
var arr = [1, 2, 3];
console.log(arr[0]);
// 2. 利用new Array()
var arr1 = new Array(); //创建了一个空的数组
var arr2 = new Array(2); //2 表示数组长度，创建了一个有两个空元素的数组
var arr3 = new Array(2, 3); //创建了数组等价于[2, 3]

检测是否为数组

instanceof运算符

// 检测是否为数组
// instanceof 运算符：检测是否为数组
var arr = [];
var obj = {};
console.log(arr instanceof Array);
console.log(obj instanceof Array);

Array.isArray() 用于确定传递的值是否是一个 Array

H5新增的方法，ie9以上版本支持

// Array.isArray()方法，返回t/f
console.log(Array.isArray(arr));
console.log(Array.isArray(obj));

翻转数组

// 翻转数组
function reverse(arr) {if (arr instanceof Array) {var newArr = [];for (var i = arr.length - 1; i >= 0; i--) {newArr[newArr.length] = arr[i];}return newArr;}else {return '此参数必须为数组格式';}
}
console.log(reverse([1, 2, 3]));
console.log(reverse(1, 2, 3));

添加删除数组元素的方法

// 添加删除数组元素的方法
var arr = [1, 2, 3];
// push() 在数组末尾添加一个或者多个数组元素
// 参数直接写数组元素，返回值是新数组的长度，原数组也会发生变化
arr.push(4);
console.log(arr);
// unshift() 在数组开头添加一个或者多个数组元素,其他同push()
arr.unshift('Elsie');
console.log(arr);
// pop()可以删除数组的最后一个元素,返回值是删除的那个元素
arr.pop();
console.log(arr);
// shift()可以删除数组的第一个元素,返回值是删除的那个元素
arr.shift();

筛选数组

/*  有一个包含工资的数组[1500, 1200, 2000, 2100, 1800],要求把数组中工资超过2000的删除，剩余的放到新数组里面 */
var arr = [1500, 1200, 2000, 2100, 1800];
var newArr = [];
for (var i = 0; i < arr.length; i++) {if (arr[i] < 2000) {newArr.push(arr[i]);}
}
console.log(newArr);

数组排序

// 数组排序
// 翻转数组
var arr = ['yz', 'dw', 'zwy'];
arr.reverse();
console.log(arr);
// 冒泡排序 sort的多位数排序存在问题通过在里面加函数来解决
var arr1 = [5, 2, 0];
arr1.sort(function (a, b) {return a - b; //按照升序的顺序排列// return b - a;//按照降序的顺序排列
});
console.log(arr1);

数组索引方法

arr.indexOf(‘要查找的字符’,[起始的位置]);

数组去重【重点】

有一个数组[‘c’, ‘a’, ‘z’, ‘a’, ‘x’, ‘a’, ‘x’, ‘c’, ‘b’]，要求去除数组中的重复元素。

思路：将旧数组中不重复的元素选出来放在新数组中，重复元素只保留一个放在新数组中实现去重。
核心算法：遍历旧数组，查询新数组，有就不添加，没有就添加。利用新数组.indexOf(数组元素)，如果返回-1就说明新数组里面没有该元素

// 数组去重 封装一个去重的函数 unique
function unique(arr) {var newArr = [];for (var i = 0; i < arr.length; i++) {if (newArr.indexOf(arr[i]) === -1) {newArr.push(arr[i]);}}return newArr;
}
var demo = unique(['c', 'a', 'z', 'a', 'x', 'a', 'x', 'c', 'b']);
console.log(demo);

数组转换为字符串
// 数组转换为字符串 // toString()直接将数组转换为字符串默认，分割 var arr = [1, 2, 3]; console.log(arr.toString());//1,2,3 // join(分隔符) var arr1 = ['yz', 'zwy', 'tjc']; console.log(arr1.join());//yz,zwy,tjc console.log(arr1.join('-'));//yz-zwy-tjc

五、字符串对象

一般基本数据类型没有属性和方法，只有对象才有属性和方法。

基本包装类型：将简单数据类型包装成复杂数据类型，从而使基本数据类型拥有属性和方法。有三种基本包装类型：String、Number、Boolean

// 基本包装类型
var str = 'andy';
console.log(str.length);
// 将简单数据类型包装为复杂数据类型
var temp = new String('andy');
// 把临时变量赋值给str
str = temp;
// 销毁临时变量
temp = null;

字符串的不可变：指里面的值不可变，虽然看上去改变了内容但实质是地址变了——内存中开辟了一个新的内存空间。

根据字符返回位置

因为字符串的不可变性，字符串所有方法都不会修改字符串本身，而是返回一个新的字符串。

str.indexOf(‘要查找的字符’,[起始的位置]);

案例：查找字符串’abcoefoxyozzopp’中所有o出现的位置以及次数

核心算法：先查找第一个o出现的位置，只要indexOf返回的不是-1就往后查找；利用第二个参数，当前索引加一，实现继续查找。

var str = 'abcoefoxyozzopp';
var index = str.indexOf('o');
var num = 0;
// 循环查找，每次索引加1
while (index !== -1) {console.log(index);num++;index = str.indexOf('o', index + 1);
}
console.log('o出现的次数是' + num);

根据位置返回字符【重点】

// 根据位置返回字符
// charAt(index)
var str = 'andy';
console.log(str.charAt(3));
// 遍历所有的字符
for (var i = 0; i < str.length; i++) {console.log(str.charAt(i));
}
//charCodeAt(index) 返回相应索引号的字符ASCII值 目的：判断用户按下了哪个键
console.log(str.charCodeAt(0));
// H5新增
console.log(str[0]);

统计出现次数最多的字符

判断一个字符串字符串’abcoefoxyozzopp’中出现次数最多的字符，并统计其次数

核心算法：利用charAt()遍历这个字符串，将每个字符都存储给对象，若对象没有该属性就为1，有就加一

js中的for…in语法

var str = 'abcoefoxyozzopp';
var o = {};
for (var i = 0; i < str.length; i++) {var chars = str.charAt(i);//chars是字符串的每一个字符if (o[chars]) {//得到的是属性值o[chars]++;} else {o[chars] = 1;}
}
console.log(o);
// 遍历对象
var max = 0;
var ch = '';
for (var k in o) {//k得到的是属性名 // o[k]得到的是属性值if (o[k] > max) {max = o[k];ch = k;}
}
console.log(max);
console.log('最多的字符是' + ch);

字符串的操作方法【重点】

替换字符串的方法

替换字符replace(‘被替换的字符’,‘替换为的字符’)，只会替换第一个字符

var str = 'andyandy';
console.log(str.replace('a', 'b'));
// 把所有的a替换成c
var str1 = 'ababab';
while (str1.indexOf('a')) {str1.replace('a', 'c');
}

字符转换为数组 split(‘分隔符’)

// 2. 字符转换为数组 split('分隔符')
var str2 = 'red, pink, blue';
var str3 = 'red&pink&blue';
console.log(str2.split(','));
console.log(str3.split('&'));

六、简单数据类型和复杂数据类型

简单数据类型：基本数据类型/值类型，在存储时变量中存储的是值本身。string、number、boolean、undefined、null【简单数据类型null返回的是一个空的对象 object】

复杂数据类型：引用类型，在存储时变量中存储的仅仅是地址（引用），在栈里面存地址，地址指向堆里面的数据。通过new关键字创造的对象（），如Object、Array、Date等

堆和栈

栈：由操作系统自动分配释放存放函数的参数值、局部变量的值等，其操作方式类似于数据结构中的栈；简单数据类型存放在栈里面
堆：存储复杂类型，一般由程序员分配释放，若程序员不释放，由垃圾回收机制回收。复杂数据类型存放到堆里面

但JavaScript本身没有堆栈的概念，这里只是便于理解。

在复杂类型传参时，函数的形参也可看成一个变量，当把引用类型变量传给形参时其实是把变量在栈空间里保存的对地址复制给了形参，形参和实参其实保存的是同一个堆地址，所以操作的是一个对象。

【JavaScript】内置对象相关推荐

JavaScript 内置对象（一）：Array 对象（构造函数、属性和方法）
Date 对象就是日期对象,它可以表示从年用毫秒的所有时间和日期.该对象是 JavaScript 内置对象中使用频率最高的一个对象. 1.Date 对象的构造函数 Date 对象的构造函数有以下4种: ...
JavaScript 内置对象（二）：Date 对象（构造函数、属性和方法）
Date 对象就是日期对象,它可以表示从年用毫秒的所有时间和日期.该对象是 JavaScript 内置对象中使用频率最高的一个对象. 1.Date 对象的构造函数 Date 对象的构造函数有以下4种: ...
对JavaScript内置对象arguments的一些见解
深入理解JavaScript内置对象arguments 这两天有伙伴问到我关于arguments的问题,使我产生了一种arguments对象容易被学习者忽略的想法,想分享一下自己对于JavaScrip ...
04-前端技术_ javaScript内置对象与DOM操作
目录五,javaScript内置对象与DOM操作 1,JavaScript对象定义和使用 2,JavaScript内置对象 2.1 Array数组 2.1.1 创建方式 2.1.2 常用属性: 2. ...
JavaScript内置对象（内置对象、查文档（MDN）、Math对象、日期对象、数组对象、字符串对象）
目录 JavaScript内置对象内置对象查文档 MDN Math对象 Math概述案例一:封装自己的对象随机数方法 random() 案例一:猜数字游戏日期对象 Date 概述 Date( ...
javaScript基础学习 - 14 - JavaScript内置对象 -案例代码
javaScript基础学习 - 14 - JavaScript内置对象 -案例代码 1. Math对象最大值 2. 封装自己的数学对象 3. Math绝对值和三个取整方法 4. Math对象随机数方 ...
JavaScript进阶 - 第7章 JavaScript内置对象
第7章 JavaScript内置对象 7-1 什么是对象 JavaScript 中的所有事物都是对象,如:字符串.数值.数组.函数等,每个对象带有属性和方法. 对象的属性:反映该对象某些特定的性质的, ...
JavaScript内置对象之 Math数学对象
JavaScript中的对象分为自定义对象.内置对象.浏览器对象 JavaScript内置对象内置对象:就是指js语言自带的一些对象,这些对象供开发者使用,并提供了一些常用 ...
JavaScript内置对象-Math对象
JavaScript内置对象-Math对象 1.内置对象 2.查文档 2.1.MDN 2.2.如何学习对象中的方法 3.Math内置对象 3.1.求最大值 3.2.封装自己的数学对象 3.3.Math ...
JavaScript（四）—— JavaScript 内置对象/JavaScript 简单数据类型与复杂类型
本篇为 JavaScript 系列笔记第三篇,将陆续更新 JavaScript(一)-- 初识JavaScript / 注释 / 输入输出语句 / 变量 / 数据类型 JavaScript(二)-- ...

【JavaScript】内置对象