Web前端-JavaScript--对象

面向对象

面向对象 是一种编程思想

  是基于面向过程的编程思想

  什么是面向过程:
      亲力亲为(自己动手 丰衣足食)
      面向程序的每一个步骤 我们之前的编程都是面向过程
  什么是面向对象:
         强调一切皆对象  强调对象调用功能
         将我们从执行者 变成了指挥者
 面向过程
      买电脑
          研究配置---坐车812 --去中关村--挨家挑
          -讨价还价 --一手交钱---一手交货---拎电脑回家
          --打开电脑--调整配置 ---开始玩
      吃饭
          研究吃什么---去菜市场--买菜---拎菜回家
          ---摘菜---洗菜---切菜--别忘记焖饭---
          爆锅----炒菜 ---出锅--盛饭--
          吃饭---洗碗
面向对象
      买电脑
          研究配置---上京东---下单---坐等玩
      吃饭
          研究吃什么---上美团---下单---坐等吃
  通过对比我们发现 对象分别是:  京东 美团

创建对象
 

字面量方式创建一个对象:
        var person={
//            对象的特征(属性)
            name:"小强",
            age:16,
            location:"文化大厦",
//            对象的行为(函数)
            eat:function(){
                console.log("这个人很能吃");
            },
            run:function () {
                console.log("这个人跑的很快");
            }


        }
//      对象调用功能

//            对象调用属性
        console.log(person.name);
        console.log(person.age);
        console.log(person.location);

//            对象调用方法
        person.eat();
        person.run();
//js所谓的基于对象 就是 系统给我们提供好了 很多现成的对象 供我们使用

对象属性的两种绑定方式:
    1.对象.属性名=属性值

    2.对象["属性名"]=属性值
           变化:

           var 变量="属性名";

         对象[变量]=属性值;
    注意!! 变量绑定属性最后绑定上的属性名是变量对应的值

var per={

    };

  per.name="小白";

//    console.log(per.name);

    per.age=16;
    per.color="黄皮肤";

//    console.log(per.color);

    per["location"]="文化大厦";

//    console.log(per.location);//不推荐这样调用
//    用什么方式绑定的  就用什么方式调用
//    z中括号绑定的属性 就用中括号调用
//    console.log(per["location"]);

    var str="length";
    per[str]=175;

    console.log(per[str]);

对象方法绑定的两种方式:
    1.对象.方法名=function(){}  匿名函数

    2.对象.方法名=有名字的函数

var per={

    };

    per.show=function () {
        console.log("请不要秀");
    };
    per.name="海楠";
//    per.show();
//    console.log(per.name);

    var demo=function () {
        console.log("海楠,请不要吃");
    };
//    函数名就等于整个函数
    per.eat=demo;
    per.eat();

JS内置对象Array

/*var arr=[];

    var arr1=new Array();*/
//        这是一个对象(引用数据类型/复杂数据类型)
    var arr=["关羽","张飞","刘备","诸葛亮"];
    
//    console.log(arr.length);
   /* console.log(arr);
//    arr.push("哈哈");
//    console.log(arr);
//    调用数组对象的reverse()方法 返回一个翻转后的数组
    console.log(arr.reverse());
    console.log(arr);*/
   
   console.log(arr.join("|"));
   console.log(arr);

内置对象date的使用

<script>

    /*
        Date 日期时间对象


     */
   /* var date=new Date(); //默认获取当前时间
//    console.log(date);


    var date1=new Date("1997-08-12 16:15:23");//获取过去指定时间
//    console.log(date1);


    var date2=new Date("2028-06-15 16:32:18");*/
//    console.log(date2);


//    单独获取年月日 小时分秒

    var date=new Date();
    console.log("年份:",date.getFullYear());
        //月份从0开始
    console.log("月份:",date.getMonth()+1);

    console.log("日期:",date.getDate());
    //老外 周日是一周的第一天 所以周日返回0
    console.log("星期:",date.getDay());
    console.log("小时:",date.getHours());
    console.log("分钟:",date.getMinutes());
    console.log("秒数:",date.getSeconds());
        //1秒=1000毫秒
    console.log("毫秒:",date.getMilliseconds());
    
</script>

内置对象math的使用

<script>
//    console.log(Math.PI);//π  圆周率

//    随机数  默认0~1之间随机 但是不包括1
  /* for(var i=0;i<10;i++){
       console.log(Math.random());
   }*/

//    0~100之间整数的随机
   /* for(var i=0;i<10;i++){
        console.log(parseInt(Math.random()*11));
    }*/

    //5~10之间随机

for(var i=0;i<10;i++){
    console.log(5+parseInt(Math.random()*6));
}
    
</script>