JavaScript内置对象
2018-01-23 本文已影响10人
白小白不姓白
-
什么是内置对象?
-
使用MDN查询方法如何使用?
-
学习Math对象的3-4个方法?
-
学习Date对象的3-4个方法?
-
学习书写一个函数格式化日期?
-
学习书写一个函数计算时间差?
一、基本数据类型 与 引用数据类型的区别
1.1
-
基本数据类型
指的是简单的数据类型，有数字Number、字符串String、布尔Boolean、未定义Undefined、空Null。
-
引用数据类型
指的是复杂的数据类型，有数组Array、函数Function、对象等。
1.2 内存中的栈和堆
-
var num = 123; //基本数据类型
var a = num;
a = 456;
console.log(num); //num?
var arr = [11,22,33,44]; //引入数据类型
var arr2 = arr;
arr2[0] = '----';
console.log(arr[0]); //arr[0]?
-
栈和堆
- 内存可以分为栈区 和 堆区
- 栈区：用来存储用var关键字创建的变量名 和 基本类型的数据。
- 堆区：用来存储引用类型的数据。
二.内置对象
2.1
-
思考？
内置对象、宿主对象和自定义对象的区别？
-
内置对象
系统所提供的对象如：Object、Array、Math、Date等等。
-
宿主对象
JS所运行的环境提供的对象比如：BOM中的Window、DOM中的document；
-
自定义对象
自定义构造函数所创建的对象。
2.2 学习内置对象
-
手册
W3C在线或离线手册
-
如何学习一个对象中的方法？
- 方法中功能
- 方法的参数和类型
- 方法的返回值
- demo
2.3 Math对象
-
Math对象介绍
Math本身就是一个对象，该对象中集合了很多关于数学运算的方法。也就是说，对于后期的一些复杂一些的数学运算，不需要自己动手去运算，直接调用Math对象中的方法实现即可
-
Math对象常用的方法
- Math.abs(数字); 获取一个数字的绝对对象
- Math.round(数字); 四舍五入
- Math.PI; π
- Math.ceil(数字); 向上取整
- Math.floor(数字); 向下取整
- Math.random(); 随机数[0,1);
- Math.max(数字,数字,数字...); 求最大数
- Math.min(数字,数字,数字...); 求最小数
2.4 Date类型对象
-
Date类型对象介绍
- Date类型对象是JavaScript提供的日期和时间的操作接口。它可以表示的时间范围是，1970年1月1日00:00:00前后的各1亿天（单位为毫秒）。
- 类型：Date
- 创建日期对象的方式：
<pre class="md-fences md-end-block" lang="javascript" contenteditable="false" cid="n177" mdtype="fences" style="box-sizing: border-box; overflow: visible; font-family: Consolas, "Liberation Mono", Courier, monospace; font-size: 0.9em; white-space: pre; display: block; break-inside: avoid; text-align: left; background-image: ; background-position: var(--code-block-bg-color); background-size: ; background-repeat: var(--code-block-bg-color); background-attachment: ; background-origin: ; background-clip: ; background-color: rgb(248, 248, 248); position: relative !important; border: 1px solid rgb(221, 221, 221); border-radius: 3px; padding: 8px 1em 6px; margin-bottom: 15px; margin-top: 15px; width: inherit;"> new Date(); //当前时间 new Date(value); //value，传入的毫秒 new Date(dateString); //字符串 new Date(year, month[, day[, hour[, minutes[, seconds[, milliseconds]]]]]);// 数字</pre> -
Date类型对象常用的方法
- 获取设置年月日
<pre class="md-fences md-end-block" lang="javascript" contenteditable="false" cid="n186" mdtype="fences" style="box-sizing: border-box; overflow: visible; font-family: Consolas, "Liberation Mono", Courier, monospace; font-size: 0.9em; white-space: pre; display: block; break-inside: avoid; text-align: left; background-image: ; background-position: var(--code-block-bg-color); background-size: ; background-repeat: var(--code-block-bg-color); background-attachment: ; background-origin: ; background-clip: ; background-color: rgb(248, 248, 248); position: relative !important; border: 1px solid rgb(221, 221, 221); border-radius: 3px; padding: 8px 1em 6px; margin-bottom: 15px; margin-top: 15px; width: inherit;"> getFullYear(从Date对象以四位数字返回年份) / setFullYear(设置年份四位数字) 年 <script type="text/javascript"> var d = new Date() document.write(d.getFullYear()) </script> //2017 <script type="text/javascript"> var d = new Date() d.setFullYear(1992) document.write(d) </script> //Web Nov 18 1992 01:19:12 GMT+0800 getMonth(获取Date的月份) / setMonth(设置Date月份数字) 月 注意：获取月份是从0开始的 getDate(获取Date的日期) / setDate(设置Date的日期数字) //日</pre>- 获取星期几
<pre class="md-fences md-end-block" lang="javascript" contenteditable="false" cid="n191" mdtype="fences" style="box-sizing: border-box; overflow: visible; font-family: Consolas, "Liberation Mono", Courier, monospace; font-size: 0.9em; white-space: pre; display: block; break-inside: avoid; text-align: left; background-image: ; background-position: var(--code-block-bg-color); background-size: ; background-repeat: var(--code-block-bg-color); background-attachment: ; background-origin: ; background-clip: ; background-color: rgb(248, 248, 248); position: relative !important; border: 1px solid rgb(221, 221, 221); border-radius: 3px; padding: 8px 1em 6px; margin-bottom: 15px; margin-top: 15px; width: inherit;"> getDay(); //0-6（周日0到周六6）</pre>- 获取设置时分秒毫秒
<pre class="md-fences md-end-block" lang="javascript" contenteditable="false" cid="n195" mdtype="fences" style="box-sizing: border-box; overflow: visible; font-family: Consolas, "Liberation Mono", Courier, monospace; font-size: 0.9em; white-space: pre; display: block; break-inside: avoid; text-align: left; background-image: ; background-position: var(--code-block-bg-color); background-size: ; background-repeat: var(--code-block-bg-color); background-attachment: ; background-origin: ; background-clip: ; background-color: rgb(248, 248, 248); position: relative !important; border: 1px solid rgb(221, 221, 221); border-radius: 3px; padding: 8px 1em 6px; margin-bottom: 15px; margin-top: 15px; width: inherit;"> getHours() / setHours(数字) 时 getMinutes() / setMinutes(数字)分 getSeconds() / setMinutes(数字) 秒 getMilliseconds() / setMilliseconds(数字) 毫秒</pre>- 获取设置毫秒1970年1月1日至今的毫秒
<pre class="md-fences md-end-block" lang="javascript" contenteditable="false" cid="n199" mdtype="fences" style="box-sizing: border-box; overflow: visible; font-family: Consolas, "Liberation Mono", Courier, monospace; font-size: 0.9em; white-space: pre; display: block; break-inside: avoid; text-align: left; background-image: ; background-position: var(--code-block-bg-color); background-size: ; background-repeat: var(--code-block-bg-color); background-attachment: ; background-origin: ; background-clip: ; background-color: rgb(248, 248, 248); position: relative !important; border: 1px solid rgb(221, 221, 221); border-radius: 3px; padding: 8px 1em 6px; margin-bottom: 15px; margin-top: 15px; width: inherit;"> getTime(); / setTime(数字);</pre>
