JavaScript(2)

4、内部对象

标准对象

 typeof 12
 "number"
 typeof '123'
 "string"
 typeof true
 "boolean"
 typeof NaN
 "number"
 typeof []
 "object"
 typeof {}
 "object"
 typeof Math.abs
 "function"
 typeof undefined
 "undefined"

  

4.1、Date

基本使用

 var now = new Date();//Sat May 09 2020 14:54:00 GMT+0800 (中国标准时间) {}
 now.getFullYear();//获取年份
 now.getMonth();//月  0~11  !
 now.getDate();//日
 now.getDay();//星期几
 now.getHours();//时
 now.getMinutes();//分
 now.getSeconds();//秒
 ​
 now.getTime();//时间戳,全世界统一!从1970 1.1 0:00:00开始计时的毫秒数
 console.log(new Date(1589007240086))//时间戳转为时间

  

转换

 now.toLocaleString();//把现在的时间转化为当地的时间表示
 >"2020/5/9 下午2:54:00"
 now.toGMTString();//转化为GMT 格林威治时间-->  北京时间=GMT时间+8小时。
 >"Sat, 09 May 2020 06:54:00 GMT"

  

4.2、JSON

JSON 是什么

早期,所有的数据传输习惯使用XML文件!

引自百度百科:

JSON是一种轻量级的数据交换格式,简洁和清晰的层次结构使得JSON成为理想的数据交换语言,易于人阅读和编写,同时也易于机器解析和生成,并有效的提升网络传输效率。

在js中一切皆为对象,任何js支持的类型都可以用JSON来表示!

格式:

  • 对象都用{}

  • 数组都用[]

  • 所有的键值对都用 key:value

JSON字符串和JS对象的转化

 var user = {
     name:'zhangyaoyuan',
     age:3,
     sex:'男'
 }
 //对象转化为json字符串
 var jsonUser = JSON.stringify(user);
 //结果:{"name":"zhangyaoyuan","age":"3","sex":"男"}
 //json字符串转化为对象,参数为json字符串!
 var obj = JSON.parse('{"name":"zhangyaoyuan","age":"3","sex":"男"}');
很多人搞不清楚,JSON和JS对象的区别

 var abj = {a:'hello',b:'hellob'};//对象
 var json = '{"a":"hello","b":"hellob"}';//json其实是一个字符串

  

5、面向对象编程

原型对象

JavaScript、Java、c#...都是面向对象;JavaScript有些区别!

  • 类:模板

  • 对象:具体的实例

在JavaScript中需要换一下思维方式!

原型对象:

在JavaScript中,原型其实就是父类!只是没有类的概念,称其为原型对象!

 var student = {
     name:"zyy",
     age:3;
     run:function(){
         console.log(this.name+"run....");
     }
 };
 //别的对象怎么用student对象内的方法呢?
 var xiaoming = {
     name : "xiaoming";
 };
 ​
 //原型对象出来了!
 xiaoming._proto_ = student;//xiaoming的原型对象为student!
 //就可以调用了!
 xiaoming.run();

  

接下来对JavaScript的prototype以及函数构造对象面向对象思想进行总结!!!很重要!

要理解四个东西:

  1. 私有变量、函数

    这个就是普通的函数定义,根据作用域知识,函数内的变量和内部的函数(就是函数内还有函数)都只在本函数内生效,所以称为私有变量、函数!

     function Obj(){
                     var a=0; //私有变量
                     var fn=function(){ //私有函数
     ​
                     }
     }
    

      

    这里,要理解一个东西!

    由于js万物皆对象,所以函数本身就是一个对象!当直接调用函数时,他就是一个函数,然而,当对他执行new操作时,他就变成了对象!new出的叫做实例!这个实例就可以调用这个函数内的或者是对象内的属性(变量)和方法(函数),同理,不new直接用它调用内部的属性方法也没问题!就是说他到底是什么,就看你把他看做什么!!!

    对于私有变量、函数,实例是无法访问到的,在逻辑上也不通顺,所以私有变量和私有函数一般不谈调用!如果非要调用,就要按照面向对象的规则先定义!就是接下来说的静态!

  2. 静态变量、函数

    在函数体外,用面向对象方式定义进去属性和方法!

     function Obj(){
     ​
                 }
     ​
                 Obj.a=0; //静态变量
     ​
                 Obj.fn=function(){ //静态函数
     ​
                 }
     ​
                 console.log(Obj.a); //0
                 console.log(typeof Obj.fn); //function
     ​
                 var o=new Obj();
                 console.log(o.a); //undefined
                 console.log(typeof o.fn); //undefined
    

      

    虽然可以调用了,但是仅仅是函数本身的调用(和Java的静态含义相同),实例无法调用!如果非要实例调用,就是接下来的实例变量、函数!

  3. 实例变量、函数

    就是在函数体内,在属性和方法前面加上this关键字,关于this前面有讲解,就是谁调用他他指向谁,但是也侧面反映了必须要有其他东西的调用!函数本身却不能调用了(不然默认为是window调用的!)

    function Obj(){
                    this.a=[]; //实例变量
                    this.fn=function(){ //实例方法
    
                    }
                }
    
                console.log(typeof Obj.a); //undefined
                console.log(typeof Obj.fn); //undefined
    
                var o=new Obj();
                console.log(typeof o.a); //object
                console.log(typeof o.fn); //function
    

      

    然鹅,这种调用有一个特点,实例调用的this仅仅是调用,只改变这一次,而不能永远的改变这个属性或者方法,结束调用后,一切还原!如果想永久改变呢?prototype登场了!

  4. prototype来定义属性、方法

    在函数体外,用prototype添加属性、方法:

    function Person(name){
                    this.name=name;
                }
    
                Person.prototype.share=[];
    
                Person.prototype.printName=function(){
                    alert(this.name);
                }
    
                var person1=new Person('Byron');
                var person2=new Person('Frank');
    
                person1.share.push(1);
                person2.share.push(2);
                console.log(person2.share); //[1,2]
    

      

     

     

class 继承

class关键字,是在ES6引入的新特性,因为上面那一套确实对Java程序员不友好,所以就把Java的东西搬过来了!

1、定义一个类、属性、方法

//定义一个学生类
class student{
    constructor(name){//构造函数!
        this.name = name;
    }
    
    hello(){
        alert('hello');
    }
}
//和Java一样了
var xiaoming = new student("xiaoming");
xiaoming.hello();//hello

  

2、继承

class xiaoStudent extends student{
    constructor(name,grade){
        super(name);//不加会报错?
        this.grade = grade;
    }
    myGrade(){
        alert('我是一名小学生');
    }
}

var xiaohong = new xiaoStudent('xiaohong',1);
xiaohong.myGrade();//我是一名小学生

 

本质上:查看对象原型

原型链

图中由相互关联的原型组成的链状结构就是原型链,也就是蓝色的这条线。

 

 

 

posted @ 2021-02-04 22:30  yyComeOn  阅读(65)  评论(0编辑  收藏  举报