1 内置对象

JavaScript 中的对象分为3种：自定义对象 、内置对象、 浏览器对象
内置对象就是指 JS 语言自带的一些对象，这些对象供开发者使用，并提供了一些常用的或最基本而必要的功能（属性和方法）
JavaScript 提供了多个内置对象：Math、 Date 、Array、String等。

学习一个内置对象的使用，只要学会其常用成员的使用即可，我们可以通过查文档学习，可以通过MDN/W3C来查询。

Mozilla 开发者网络（MDN）提供了有关开放网络技术（Open Web）的信息，包括 HTML、CSS 和万维网及 HTML5 应用的 API。

MDN:   https://developer.mozilla.org/zh-CN/

2 Math 对象

2.1 概述

Math 对象不是构造函数，它具有数学常数和函数的属性和方法。跟数学相关的运算（求绝对值，取整、最大值等）可以使用 Math 中的成员。

Math.PI       // 圆周率
Math.floor()     // 向下取整
Math.ceil()            // 向上取整
Math.round()           // 四舍五入版 就近取整   注意 -3.5   结果是  -3
Math.abs()       // 绝对值
Math.max()/Math.min()    // 求最大和最小值

注意：方法必须带括号

2.2 随机数方法 random()

random() 方法可以随机返回一个小数，其取值范围是 [0，1)，左闭右开 0 <= x < 1

得到一个两数之间的随机整数，包括两个数在内

function getRandom(min, max) {return Math.floor(Math.random() * (max - min + 1)) + min;
}

3 日期对象

3.1 Date 概述

Date 对象和 Math 对象不一样，他是一个构造函数，所以我们需要实例化后才能使用

Date 实例用来处理日期和时间

3.2 Date()方法的使用

1. 获取当前时间必须实例化

var now = new Date();
console.log(now);

2. Date() 构造函数的参数

如果括号里面有时间，就返回参数里面的时间。例如日期格式字符串为‘2019-5-1’，可以写成new Date('2019-5-1')  或者 new Date('2019/5/1')

如果Date()不写参数，就返回当前时间

如果Date()里面写参数，就返回括号里面输入的时间

3.3 日期格式化

我们想要 2019-8-8  8:8:8 格式的日期，要怎么办？

需要获取日期指定的部分，所以我们要手动的得到这种格式。

3.4 获取日期的总的毫秒形式

Date 对象是基于1970年1月1日（世界标准时间）起的毫秒数

我们经常利用总的毫秒数来计算时间，因为它更精确

// 实例化Date对象
var now = new Date();
// 1. 用于获取对象的原始值
console.log(date.valueOf())
console.log(date.getTime())
// 2. 简单写可以这么做
var now = + new Date();
// 3. HTML5中提供的方法，有兼容性问题
var now = Date.now();

案例：做一个倒计时效果

①核心算法：输入的时间减去现在的时间就是剩余的时间，即倒计时 ，但是不能拿着时分秒相减，比如 05 分减去25分，结果会是负数的。

②用时间戳来做。用户输入时间总的毫秒数减去现在时间的总的毫秒数，得到的就是剩余时间的毫秒数。

③把剩余时间总的毫秒数转换为天、时、分、秒 （时间戳转换为时分秒）

转换公式如下：

d = parseInt(总秒数/ 60/60 /24);    //  计算天数

h = parseInt(总秒数/ 60/60 %24)   //   计算小时

m = parseInt(总秒数 /60 %60 );     //   计算分数

s = parseInt(总秒数%60);              //   计算当前秒数

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title><script>// 倒计时效果// 1.核心算法：输入的时间减去现在的时间就是剩余的时间，即倒计时 ，但是不能拿着时分秒相减，比如 05 分减去25分，结果会是负数的。// 2.用时间戳来做。用户输入时间总的毫秒数减去现在时间的总的毫秒数，得到的就是剩余时间的毫秒数。// 3.把剩余时间总的毫秒数转换为天、时、分、秒 （时间戳转换为时分秒）// 转换公式如下： //  d = parseInt(总秒数/ 60/60 /24);    //  计算天数//  h = parseInt(总秒数/ 60/60 %24)   //   计算小时//  m = parseInt(总秒数 /60 %60 );     //   计算分数//  s = parseInt(总秒数%60);            //   计算当前秒数function countDown(time) {var nowTime = +new Date(); // 返回的是当前时间总的毫秒数var inputTime = +new Date(time); // 返回的是用户输入时间总的毫秒数var times = (inputTime - nowTime) / 1000; // times是剩余时间总的秒数 var d = parseInt(times / 60 / 60 / 24); // 天d = d < 10 ? '0' + d : d;var h = parseInt(times / 60 / 60 % 24); //时h = h < 10 ? '0' + h : h;var m = parseInt(times / 60 % 60); // 分m = m < 10 ? '0' + m : m;var s = parseInt(times % 60); // 当前的秒s = s < 10 ? '0' + s : s;return d + '天' + h + '时' + m + '分' + s + '秒';}console.log(countDown('2019-5-1 18:00:00'));var date = new Date();console.log(date);</script>
</head><body></body></html>

4 数组对象

4.1 检测是否为数组

创建数组对象的两种方式

字面量方式

new Array()

instanceof 运算符，可以判断一个对象是否属于某种类型

Array.isArray()用于判断一个对象是否为数组，isArray() 是 HTML5 中提供的方法

var arr = [1, 23];
var obj = {};
console.log(arr instanceof Array); // true
console.log(obj instanceof Array); // false
console.log(Array.isArray(arr));   // true
console.log(Array.isArray(obj));   // false

4.2 添加删除数组元素的方法

4.3 数组排序

var arr = [1, 64, 9, 6];
arr.sort(function(a, b) {return b - a;      // 降a序// return a - b;   // 升序
});
console.log(arr);

4.4 数组索引方法

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

①目标：把旧数组里面不重复的元素选取出来放到新数组中，重复的元素只保留一个，放到新数组中去重。

②核心算法：我们遍历旧数组，然后拿着旧数组元素去查询新数组，如果该元素在新数组里面没有出现过，我们就添加，否则不添加。

③我们怎么知道该元素没有存在？ 利用 新数组.indexOf(数组元素)  如果返回时 -1 就说明 新数组里面没有改元素

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title><script>// 数组去重 ['c', 'a', 'z', 'a', 'x', 'a', 'x', 'c', 'b'] 要求去除数组中重复的元素。// 1.目标： 把旧数组里面不重复的元素选取出来放到新数组中， 重复的元素只保留一个， 放到新数组中去重。// 2.核心算法： 我们遍历旧数组， 然后拿着旧数组元素去查询新数组， 如果该元素在新数组里面没有出现过， 我们就添加， 否则不添加。// 3.我们怎么知道该元素没有存在？ 利用 新数组.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'])var demo = unique(['blue', 'green', 'blue'])console.log(demo);</script>
</head><body></body></html>

4.5 数组转换为字符串

5 字符串对象

5.1 基本包装类型

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

基本包装类型就是把简单数据类型包装成为复杂数据类型，这样基本数据类型就有了属性和方法。

5.2 字符串的不可变

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

var str = 'abc';
str = 'hello';
// 当重新给 str 赋值的时候，常量'abc'不会被修改，依然在内存中
// 重新给字符串赋值，会重新在内存中开辟空间，这个特点就是字符串的不可变
// 由于字符串的不可变，在大量拼接字符串的时候会有效率问题
var str = '';
for (var i = 0; i < 100000; i++) {str += i;
}
console.log(str); // 这个结果需要花费大量时间来显示，因为需要不断的开辟新的空间

5.3 根据字符返回位置

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

5.4 根据位置返回字符（重点）

5.5 字符串操作方法（重点）

5.6 replace()方法

replace() 方法用于在字符串中用一些字符替换另一些字符。

其使用格式如下：

replace(被替换的字符串， 要替换为的字符串)；

5.7 split()方法

split()方法用于切分字符串，它可以将字符串切分为数组。在切分完毕之后，返回的是一个新数组。

例如下面代码：

var str = 'a,b,c,d';
console.log(str.split(','));   // 返回的是一个数组 [a, b, c, d]

6 小练习

以下有两个数组，一个数组arr是班级里所有的学员的名称，一个数组currentArr是提交了每日反馈的学员名单，请创建一种算法，把未提交每日反馈的学员筛选出来

var arr = ["张瑞淑", "徐海涛", "谢岗岗", "薛鹏", "魏明杨", "党婷", "熊飞", "郑翠翠", "李航卫", "屈涛", "汪孝双", "代攀飞", "武志钰", "王亚龙", "周芙榕", "李涛", "郝颖", "文冲洋", "王旭拯", "胡佳豪", "寇晓丽", "马晓晗","王思聪", "张绿", "李德", "郑萍", "张凯", "张嘉成", "葛云侠", "杨磊", "任变", "景德", "高卷林", "刘益凡", "赵娜", "陈章鸣", "张荣召", "赵凯旋", "程倩倩", "脱朝平", "刘吉利", "郭苗苗", "马建峰", "潘瑞", "闫翔", "马晨", "李轩轩", "黄红梅", "刘书彬", "罗强", "刘东","王可可"  "陈泽文", "李嘉琪", "段佳琦", "黄燕", "邱淑鸿", "宋翔宇", "王波", "樊琳", "王兆国", "许成", "李兴"];

var currentArr = ["张瑞淑", "徐海涛", "谢岗岗", "薛鹏", "魏明杨", "党婷", "熊飞", "郑翠翠", "李航卫", "屈涛", "汪孝双", "代攀飞", "武志钰", "王亚龙", "周芙榕", "李涛", "郝颖", "文冲洋", "王旭拯", "胡佳豪", "寇晓丽", "马晓晗", "张绿", "李德","郑萍", "张凯", "张嘉成", "葛云侠", "杨磊", "任变", "景德", "高卷林", "刘益凡", "赵娜", "陈章鸣", "张荣召", "赵凯旋", "程倩倩", "脱朝平", "刘吉利", "郭苗苗", "马建峰", "潘瑞", "闫翔", "马晨", "李轩轩", "黄红梅", "刘书彬", "罗强", "刘东", "陈泽文", "李嘉琪", "段佳琦", "黄燕", "邱淑鸿", "宋翔宇", "王波", "樊琳", "王兆国", "许成", "李兴"];

<script>var arr = ["张瑞淑", "徐海涛", "谢岗岗", "薛鹏", "魏明杨", "党婷", "熊飞", "郑翠翠", "李航卫", "屈涛", "汪孝双", "代攀飞", "武志钰", "王亚龙", "周芙榕", "李涛", "郝颖", "文冲洋", "王旭拯", "胡佳豪", "寇晓丽", "马晓晗", "王思聪", "张绿", "李德", "郑萍", "张凯", "张嘉成", "葛云侠", "杨磊", "任变", "景德", "高卷林", "刘益凡", "赵娜", "陈章鸣", "张荣召", "赵凯旋", "程倩倩", "脱朝平", "刘吉利", "郭苗苗", "马建峰", "潘瑞", "闫翔", "马晨", "李轩轩", "黄红梅", "刘书彬", "罗强", "刘东", "王可可" , "陈泽文", "李嘉琪", "段佳琦", "黄燕", "邱淑鸿", "宋翔宇", "王波", "樊琳", "王兆国", "许成", "李兴"];var currentArr = ["张瑞淑", "徐海涛", "谢岗岗", "薛鹏", "魏明杨", "党婷", "熊飞", "郑翠翠", "李航卫", "屈涛", "汪孝双", "代攀飞", "武志钰", "王亚龙", "周芙榕", "李涛", "郝颖", "文冲洋", "王旭拯", "胡佳豪", "寇晓丽", "马晓晗", "张绿", "李德", "郑萍", "张凯", "张嘉成", "葛云侠", "杨磊", "任变", "景德", "高卷林", "刘益凡", "赵娜", "陈章鸣", "张荣召", "赵凯旋", "程倩倩", "脱朝平", "刘吉利", "郭苗苗", "马建峰", "潘瑞", "闫翔", "马晨", "李轩轩", "黄红梅", "刘书彬", "罗强", "刘东", "陈泽文", "李嘉琪", "段佳琦", "黄燕", "邱淑鸿", "宋翔宇", "王波", "樊琳", "王兆国", "许成", "李兴"];var noArr = []for (var i = 0; i < arr.length; i++) {if (currentArr.indexOf(arr[i]) === -1) {noArr[noArr.length] += arr[i]} else {continue}}console.log(noArr)</script>

7 简单类型与复杂类型

简单类型又叫做基本数据类型或者值类型，复杂类型又叫做引用类型。

值类型：简单数据类型/基本数据类型，在存储时变量中存储的是值本身，因此叫做值类型

string ，number，boolean，undefined，null

引用类型：复杂数据类型，存储时变量中存储的仅仅是地址（引用），因此叫做引用数据类型

通过 new 关键字创建的对象（系统对象、自定义对象），如 Object、Array、Date等

1、栈（操作系统）：由操作系统自动分配释放存放函数的参数值、局部变量的值等。其操作方式类似于数据结构中的栈；

简单数据类型存放到栈里面

2、堆（操作系统）：存储复杂类型(对象)，一般由程序员分配释放，若程序员不释放，由垃圾回收机制回收。

复杂数据类型存放到堆里面

函数的形参也可以看做是一个变量，当我们把一个值类型变量作为参数传给函数的形参时，其实是把变量在栈空间里的值复制了一份给形参，那么在方法内部对形参做任何修改，都不会影响到的外部变量。

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

注意：JavaScript中没有堆栈的概念，通过堆栈的方式，可以让大家更容易理解代码的一些执行方式，便于将来学习其他语言。

JS学习笔记之内置对象 4.21相关推荐

  1. 前端JS学习笔记——内置对象Math、Date 、Array、String

    目录 1.Math常用方法 2.Date()方法 如何获取Date的时间戳 Date()方法的使用 格式化日期时间 格式化输出一串时间日期 倒计时功能 3.Array方法 创建数组对象的两种方法 检测 ...

  2. JS 学习笔记--11---内置对象(Global/Math)

    练习中使用的浏览器是IE10,如果各位朋友有不同意见或者遇到浏览器不兼容问题,希望指正 1.内置对象的定义:有ECMAScript实现提供的.不依赖与宿主环境的对象,在ECMAScript运行之前就已 ...

  3. JS学习笔记17-面向对象编程-原型

    文章目录 一.面向对象 二.第一个面向对象程序 2.1 工厂模式 2.2 工厂模式的缺点 2.2.1 没有new , 2.2.2 函数重复调用 2.3 prototype(原型): 2.4 类(模子) ...

  4. js学习笔记数组和对象

    数组 在JS中创建数组非常简单. 直接[ ]即可. 也可以用正规军的new Array(). 不过效果都是一样的. var as = [11,22,33,44,55]; var bs = new Ar ...

  5. jsp学习笔记 - 内置对象 session

    1.session 主要用来用户的登录和注销 设置用户名,获取用户名 session.setAttribute("username","johnson"); s ...

  6. 11、JS笔记-内置对象

    1.内置对象 js中对象分为三种: 自定义对象.内置对象.浏览器对象(js独有) 内置对象: js语言自带的对象,供开发者使用,提供一些常用或基本的功能(属性和方法) 2.Math对象 Math中所有 ...

  7. jmh学习笔记-State共享对象

    系列文章目录 jmh学习笔记-源代码编译与bench mode jmh学习笔记-State共享对象 jmh学习笔记-State共享对象前后置方法 jmh学习笔记-代码清除 jmh学习笔记-常量折叠 j ...

  8. WebGL three.js学习笔记 6种类型的纹理介绍及应用

    WebGL three.js学习笔记 6种类型的纹理介绍及应用 本文所使用到的demo演示: 高光贴图Demo演示 反光效果Demo演示(因为是加载的模型,所以速度会慢) (一)普通纹理 计算机图形学 ...

  9. python学习笔记4（对象／引用；多范式; 上下文管理器）

    python学习笔记4(对象/引用:多范式; 上下文管理器) ### Python的强大很大一部分原因在于,它提供有很多已经写好的,可以现成用的对象 21. 动态类型:对象/引用 对象和引用: 对象是 ...

最新文章

  1. python阿拉伯数字转中文_python中将阿拉伯数字转换成中文的实现代码
  2. 我是一只IT小小鸟读书笔记3
  3. python的循环语句机制_Python-for循环的内部机制
  4. 从计算机体系结构方面思考深度学习
  5. 商务计算机的购置方案,电子采购方案的实施.ppt
  6. RabbitMQ/pika模块
  7. JavaScript开发中几个常用知识点总结
  8. java面对对象 关键字this super
  9. [导入]屏蔽相应键盘按钮
  10. myeclipse读取mysql表中数据_在myeclipse中连接mysql查询数据
  11. 数据库级别的MD5加密（建议收藏）
  12. 【学习笔记】函数高级使用技巧：建立函数队列
  13. 大型论坛系统环境搭建(20万日IP负载平衡实战)–Nginx+Apache2+PHP+MySQL
  14. oracle判断字符串以什么开头_sql语句判断字符串以什么什么开头
  15. VScode中SVN插件详细配置【官网】
  16. c语言int temp什么意思,C中的temp是什么意思?
  17. python有理数_Python3标准库：fractions有理数
  18. Android矩阵运算总结
  19. 电脑证书错误即上网站打不开提示证书错误
  20. Kubernetes 学习路径

热门文章

  1. BeeconX路由器是什么牌子？BeeconX路由器怎么样？
  2. [NOIP模拟33]反思+题解
  3. Mac 运行windows软件
  4. 从头来过教你PHP脚本语言（一）
  5. java毕业设计乡镇卫生院信息管理mybatis+源码+调试部署+系统+数据库+lw
  6. 快速删除node_modules（rimraf）
  7. 第三方登录mysql表_浅谈数据库用户表结构设计，第三方登录
  8. 任泽平最新演讲：从这6个周期，读懂中国经济未来走势
  9. semi-suppervised learning 半监督学习
  10. 广州奶茶饮品培训学校哪家好？广州学奶茶技能要多少钱？