【JavaScript】JavaScript基础教程(6)

前言：

本文内容：JSON对象、面向对象原型继承、面向对象class继承

推荐免费JavaScript基础讲解视频：【狂神说Java】JavaScript最新教程通俗易懂_哔哩哔哩_bilibili

JSON对象

JSON: JavaScript Object Notation(JavaScript 对象表示法)

JSON 是存储和交换文本信息的语法，类似 XML。

JSON 比 XML 更小、更快，更易解析。

格式

对象用{}
数组用[]
所有的键值对使用key:value

JSON字符串和JS对象的转化

var user = {
    name: "张三",
    age: 10,
    sex: '男'
}
// 对象转化为json字符串
var json = JSON.stringify(user);
// json字符串转换为对象 参数为json字符串
var obj = JSON.parse('{"name":"张三","age":10,"sex":"男"}');

面向对象原型继承

JavaScript，Java，C#… 面向对象。

JavaScrip的区别：

类：模板；
对象：具体的实例；

在JavaScript中需要大家换一下思维方式。

原型：

var student = {
    name: "张三",
    age: 10,
    run: function () {
        console.log(this.name+"run...")
    }
}
var li = {
    name: "李四",
}
// li的原型是student
li.__proto__= student;

定义一个类

// ES6之前给Student新增方法
function Student(){
    this.name = name;
}
Student.prototype.hello = function(){
    alert('hello');
}

面向对象class继承

在ES6中，class (类)作为对象的模板被引入，可以通过 class 关键字定义类。

class 的本质是 function。

定义一个类

// ES6之后引入的class
class Student{
    constructor(name){
        this.name = name;
    }
    hello(){
        alert('class的hello')
    }
}
var user1 = new Student('李四');
var user2 = new Student('张三');
// 运行结果
user1.name
'李四'
user2.name
'张三'

继承

// 创建Student
class Student{
    constructor(name){
        this.name = name;
    }
    hello(){
        alert('class的hello')
    }
}
// 继承
class Elementary extends Student{
    constructor(name,age) {
        super(name);// 实现父类的name
        this.age = age;// 重写方法
    }
    myFunction(){
        alert('我是一名小学生');
    }
}
var elementary = new Elementary('王五',10);