对象

一.什么是对象及使用对象的好处

对象是一组无序的相关'属性'和'方法'的集合，所有的事物都是对象，例如字符串、数值、数组、函数等
'属性'：事物的特征，在对象中用属性来表示（常用名词）
'方法'：事物的行为，在对象中用方法来表示（常用动词）

使用对象的好处：使用对象可以使我们的表达结构更清晰，更强大

二.对象的创建方式

• 1.利用字面量创建对象:就是花括号{}里面包含了表达这个具体事物（对象）的属性和方法

var obj={};//创建了一个空的对象
var obj = {
              uname: '张三丰',
              age: 18,
              sex: '男',
              sayHi: function () {
                  console.log('hi~');
              }
          }
使用对象
        1.调用对象的属性:   对象名.属性名
        console.log(obj.uname);
        //2.调用属性的另一方法： 对象名['属性名']  
        console.log(obj['age']);
        //3.调用对象的方法sayHi:   对象名.方法名
        obj.sayHi();

• 2.利用new Object创建对象

 var obj = new Object();//创建一个空对象
           obj.uname = '张三丰';
           obj.age = 18;
           obj.sex = '男';
           obj.sayHi = function () {
               console.log('hi~');
           }
           //使用对象
           //1.调用对象的属性:   对象名.属性名
           console.log(obj.uname);
           //2.调用属性的另一方法： 对象名['属性名']  
           console.log(obj['age']);
           //3.调用对象的方法sayHi:   对象名.方法名
           obj.sayHi();

• 3.利用构造函数创建对象
  为什么要利用构造函数创建对象
  （1）因为前面两种一次只能创建一个对象；
  （2）因为我们一次创建一个对象，里面很多的属性和方法是大量相同的，我们只能复制，因此我们可以利用函数的方法，重复这些相同的代码，
  什么是构造函数
  （1）定义：是一个特殊的函数，主要用来初始化对象，就是把我们对象里面一些相同的属性和方法抽象出来封装到函数里面
  （因为这个函数不一样，里面封装的不是普通代码，而是对象，所以称为构造函数）
  构造函数的语法格式

function 构造函数名(){
             this.属性=值;
             this.方法=function(){}
         }
         new 构造函数名();

eg:
function Star(uname, age, sex) {
            this.name = uname;
            this.age = age;
            this.sex = sex;
            this.sing = function (sang) {
                console.log(sang);
            }
        }
        var ldh = new Star('刘德华', 18, '男');//调用函数返回的是一个对象
        //console.log(typeof ldh);
        console.log(ldh.name);
        console.log(ldh['sex']);
        ldh.sing('冰雨');
        
        var zxy = new Star('张学友', 19, '男');
        console.log(zxy.name);

   //1.构造函数首字母大写
   //2.构造函数不需要return,就可以返回结果
   //3.我们调用构造函数，必须要用new
   //4.我们只要new Star() 调用函数就创建一个对象

三.对象的遍历

• for-in遍历对象
  for(变量 in 对象){}

var arr=[43,4,5,6,7,12];
for(var key in arr){//for in遍历数组得到下标为字符串
    //console.log(typeof key);
    console.log(arr[key]);
}

四.this对象

1.全局作用域中的this是指向window

console.log(this);

2.自定义函数中的this指向window;

unction fn() {//fn保存在window变量对象中
              console.log(this);
          } fn();

3.自执行函数中的this指向window

document.onclick=function(){
           (function(){
               console.log(this);
           })();
       }

4.对象中的方法中的this，指向调用这个方法的当前对象

var obj = {
			fn:function(){
				console.log(this);
				console.log(this === obj);//true
			}
		}
		
		window.obj.fn();

5.事件处理程序中的this,指向的是当前的事件源对象

 var btn = document.getElementById("btn");
          btn.onclick = function () {
              console.log(this);//点我吧
              console.log(this === btn);//true
          }

五.内置对象和宿主对象

内置对象 :ECMAScript中规范的对象

常用的：Global : js在浏览器端运行，这个Global：全局对象 不存在，里面提供的方法会通过解析器交给window
	    Array
	    String
	    Math
	    Date
	    RegExp
	    Number  toFixed();
	    Boolean

宿主对象 : W3C对象

BOM：浏览器对象模形
			  window:
			  ocation
			  document
			  navigator
			  history
			  screen
			DOM：
			  Node

六Math对象

1.定义

Math对象用于执行数学任务。
Math是一个内置对象，不需要创建，可以直接使用。

2.Math对象常用API

Math.PI—返回圆周率3.1415926…

Math.ceil(x)----------对数值x进行向上取整

        console.log(Math.ceil(15.7));//16
        console.log(Math.ceil(15.3));//16
        console.log(Math.ceil(15.001));//16
        console.log(Math.ceil(15.00));//15
        console.log(Math.ceil(-4.3));//-4

Math.floor(x)--------对数值x进行向下取整

       console.log(Math.floor(15.7));//15
        console.log(Math.floor(15.3));//15
        console.log(Math.floor(15.001));//15
        console.log(Math.floor(15.00));//15
        console.log(Math.floor(-4.3));//-5

Math.round(x)----对数值x进行四舍五入取整

Math.abs(x)----------返回x的绝对值

Math.pow(x,y)--------返回x的y次方

Math.sqrt(x)----------返回x的平方根

Math.min(a,b,c…)----返回abc…中的最小值

Math.max(a,b,c… )—返回abc…中的最大值

Math.random()—返回介于（0,1)之间的随机数

3.random的案例

1.如何得到 0 ~ 1 的随机整数[0,1]？

        var random = Math.round(Math.random());
        console.log(random);

2.如何得到 0 ~ 5 的随机整数[0,5]？

        var random = Math.round(Math.random() * (5 - 0)) + 0;
        console.log(random);

3.生成区间随机整数

        function randomInt(min, max) {
            return Math.round(Math.random() * (max - min)) + min;
        }
        console.log(randomInt(10, 30));

4. 写一个函数 randomCode() 生成6位随机验证码（数字、字母（大小））

   function randomInt(min, max) {
            return Math.round(Math.random() * (max - min)) + min;
        }
        console.log(randomInt(10, 30));

        function randomCode() {
            // 48-122   >57&&<65   >90&&<97
            var arr = [1, 1, 1, 1, 1, 1];
            for (var i in arr) {
                do {
                    var ascii = randomInt(48, 122);
                } while ((ascii > 57 && ascii < 65) || (ascii > 90 && ascii < 97));
                arr[i] = String.fromCharCode(ascii);
            }
            return arr.join('');
        }
        console.log(randomCode());

5. 写一个函数 randomColor 生成随机的十六进制颜色值 # 6个字符
   //0 1 2 3 4 5 6 7 8 9 a b c d e f

style:
 .box {
        width: 200px;
        height: 100px;
    }
html:
 

script:
 function randomInt(min, max) {
            return Math.round(Math.random() * (max - min)) + min;
        }
        console.log(randomInt(10, 30));
        function randomColor() {
            var str = '0123456789abcdef';
            var col = '#';
            for (var i = 0; i < 6; i++) {
                var index = randomInt(0, 15);
                col += str[index];
            }
            return col;
        }
        console.log();
        var box = document.querySelector('.box');
        box.style.backgroundColor = randomColor();

七.Date对象

Date对象用于处理日期与时间。
Date对象自动使用当前系统的日期和时间作为其初始值。

获取时间（get）

getFullYear()------从Date 对象以四位数字返回年份。
getMonth()—从Date对象返回月份(0～11).
getDate()--------从 Date对象返回一个月中的某一天(1～31).
getHours()---------返回Date对象的小时(0～23).
getMinutes()-------返回Date 对象的分钟(0～59).
getSeconds()-------返回Date 对象的秒数(0～59).
getMilliseconds()–返回Date 对象的毫秒(0 ~999).
getDay()—从 Date对象返回一周中的某一天(0～6)。
getTime()----返回1970年1月1日至今的毫秒数。

返回当前时间与起始时间之间的毫秒数:
Date.now(); // 1556556512764
返回转换后的Date对象与起始时间之间的毫秒数:
Date.parse(“2019/05/01 00:00:00”); // 1556640000000
返回一个’年月日时分秒的本地格式字符串:
d.toLocaleString(); // ‘2019/4/30 上午12:55:42’
返回一个年月日的本地格式字符串:
d.toLocaleDateString(); // ‘2019/4/30’

设置时间（set）

setFullYear()--------设置Date对象中的年份(四位数字)。
setMonth()------设置Date对象中月份(0 ~ 11)。
setDate()-------设置Date对象中月的某一天(1 ~ 31)。
setHours()------设置Date对象中的小时(0 ~ 23)。
setMinutes()------设置Date对象中的分钟(0 ~ 59)。
setSeconds()------设置Date对象中的秒钟(0~ 59)。
setiMilliseconds()–设置Date对象中的毫秒(0 ~ 999)。
setTime()--------设置Date对象(向1970/1/1添加毫秒数)。

创建指定时间点的Date对象

    var d1=new Date(毫秒数);//从时间起点开始叠加的毫秒数
    var d2=new Date('yyyy/mm/dd  hh:mm:ss');

    var d=new Date('8/20/2020');

    var d=new Date('2020/8/20');

    var d=new Date('2020/8/20 20:20:20');

    var d=new Date(2020,12,20);