526互联

方法定义,Date和JSON对象，及JavaScript式面向对象编程

发布时间 2023-04-05 22:43:47作者: ~java小白~

一.方法

1.方法的定义

 

方法就是把函数放在对象里面，对象有两个东西：属性和方法

通过 对象名.方法名（）使用

a.第一种方法定义

  <script>
    var setFun={
      name: "maming",
      birth: 2002,
      //方法 ：被包含在对象之中
      age: function (){
        var now = new Date().getFullYear();
        return now - this.birth;
      }
    }
    alert(setFun.age());
  </script>

　　方法的调用一定要带 （）

setFun.age（）；

b.第二种方法的定义

<script>
    function getAge(){
      var now = new Date().getFullYear();
      return now - this.birth;
    }
    var setFun={
      name: "maming",
      birth: 2002,
      //方法 ：被包含在对象之中
      age: getAge
    }
    alert(setFun.age());
  </script>

　　这里的this关键字指向的是getAge（）的函数中的属性，但是getAge（）中没有birth属性，所以这里执行不了

我们可以调用对象来解决：

    function getAge(){
      var now = new Date().getFullYear();
      return now - setFun.birth;
    }
    var setFun={
      name: "maming",
      birth: 2002,
      //方法 ：被包含在对象之中
      age: getAge
    }
    alert(setFun.age());
  </script>

　　这样改了以后就可以，就可以拿到那个属性了

2.apply方法：指向使用那个对象

在js中可以控制this的指向：

 <script>
    function getAge(){
      var now = new Date().getFullYear();
      return now - this.birth;
    }
    var setFun={
      name: "maming",
      birth: 2002,
      //方法 ：被包含在对象之中
      age: getAge
    }
    alert(getAge.apply(setFun,[]));
  </script>

　　getAge.apply(setFun,[  ] )； this指向了setFun对象，参数为空

 

二.内部对象

1.标准对象

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

 

2.Date对象

  <script>
    var now = new Date();  //Wed Apr 05 2023 20:44:18 GMT+0800 (中国标准时间)
    console.log(now);
    now.getFullYear();  //年
    now.getMonth();     //月  0~11 月  也是12个月
    now.getDate();      //日
    now.getDay();       //星期几
    now.getHours();     //时
    now.getMinutes();   //分
    now.getSeconds();   //秒

    now.getTime();     //时间搓    全世界统一1970-1-1 0：0
    console.log(now.getTime());  //1680698972333
    console.log(new Date(now.getTime()));   //Wed Apr 05 2023 20:49:52 GMT+0800 (中国标准时间)
  </script>

　　获得本地时间：now.toLocaleString()；

三.Json对象

Json是什么：

JSON 是一种纯字符串形式的数据，它本身不提供任何方法（函数），非常适合在网络中进行传输。JavaScript、PHP、Java、Python、C++ 等编程语言中都内置了处理 JSON 数据的方法。
JSON 是基于 JavaScript（Standard ECMA-262 3rd Edition - December 1999）的一个子集，是一种开放的、轻量级的数据交换格式，采用独立于编程语言的文本格式来存储和表示数据，易于程序员阅读与编写，同时也易于计算机解析和生成，通常用于在 Web 客户端（浏览器）与 Web 服务器端之间传递数据。

 

在JavaScript一切皆为对象，任何js支持的类型都可以使用Json来表示；

格式：

  • 对象都用{ ... }
  • 数组都用[ ... ]
  • 所有的键值对都是用 key：value
 <script>
    var user = {
      name: "mamaing",
      age: 18,
      sex: "boy"
    }
    //{name: 'mamaing', age: 18, sex: 'boy'}

    var jsonUser = JSON.stringify(user);  //将JavaScript转换为json字符串
    //  '{"name":"mamaing","age":18,"sex":"boy"}'

    var userJson = JSON.parse('{"name":"mamaing","age":18,"sex":"boy"}');  //将Json字符串转换为JavaScript对象
    //   {name: 'mamaing', age: 18, sex: 'boy'}
    //   age: 18
    //   name: "mamaing"
    //   sex: "boy"
    //   [[Prototype]]: Object

  </script>

 

Json字符串和js对象：

本质上两者没区别，毕竟靠json传值给后端的，他肯定不会改变js对象本质的值，因为稳定性好所以才都用json

Json是以字符串的形式传递的，所以是一个字符串类型

而被转换的js可以是对象，可以是数组，也可以是字符串，最后都是要转换为字符串的Json字符串的

源生的JSON两个方法：
  • JSON.stringify(   // JavaScript对象  );      //将JavaScript转换为json字符串
  • JSON.parse(   // Json字符串 );      //将Json字符串转换为JavaScript对象

四.面向对象的原型继承

1.什么是面向对象

面向对象编程的程序语言：

Java，JavaScript，C#，C++，python.......

但是JavaScript的面向对象与其它的面向对象有一些区别！

其它的面向对象：

看名字它是注重对象的。当解决一个问题的时候，面向对象会把事物抽象成对象的概念，就是说这个问题里面有哪些对象，然后给对象赋一些属性和方法，然后让每个对象去执行自己的方法，问题得到解决。

类：模板（是抽象的描述）

对象：具体的实例（实例化类，具体的实现者）

2.JavaScpirt的面向对象：

原型继承：__proto__  指向一个对象，就可以继承这个指向对象的属性和方法

<script>
    var Student ={
      name: "student",
      sex: "boy",
      run: function (){
        console.log(`${name} is running...`)
      }
    }
    var xiaoming ={
      name: "xiaoming"
    };
    xiaoming.__proto__ = Student;
  </script>

　　

xiaoming.__proto__ = Student
{name: 'student', sex: 'boy', run: ƒ}
name: "student"
run: ƒ ()
sex: "boy"
[[Prototype]]: Object

 

原型的指向就像Java的父类一样，就像继承了父类的方法和属性，所以自己也可以使用

idea 2023.1 打不出 __ 长下划线！！！！

五.面向对象的Class的继承

class关键字是ES6新特性

1.ES6以前的新增方法

 <script>
   function Student(name){
       this.name=name;
   }
   //给student新增一个方法：需要找到它的原型才能增加
   Student.prototype.hello = function (){
       alert("hello");
   }
  </script>

 

需要找到对应函数的原型才能新增，

prototype：原型

2.ES6后，通过类定义和继承

定义一个类，和Java类似

 class Student{
      //构造器
      constructor(name) {
          this.name = name;
      }
      hello(){
          alert("hello");
      }
  }

 

值得注意的是JavaScript的构造器都是constructor（）然后里面填属性（且只有这一个构造器）；

Java的是类名来构成构造器（可以有多个，有参无参构造）；

3.类的继承

  <script>
  class Student{
      //构造器
      constructor(name) {
          this.name = name;
      }
      hello(){
          alert("hello");
      }
  }
class xiaoming extends Student{
      constructor(name,grade) {
          super(name);
          this.grade=grade;
      }
      myFun(){
          alert("xiaoming");
      }
}
var xiao = new xiaoming("xiaoming",2);
  </script>

 

4.原型链

所有的原型都指向object

__proto__:Object