Web基础关键_008_JavaScript 的 BOM、ES6、构造函数、原型

<html>

<head>
    <title>Test Javascript</title>
    <script>
        alert("跳转至百度");
        location.href = "https://www.baidu.com";
    </script>
</head>

</html>

（2）History 对象

可以参考【Window History 对象】。

html 复制代码

<html>

<head>
    <title>History Test01</title>
</head>

<body>
    <a href="historyTest02.html">下一页</a>
    <button id="btn">下一页</button>
    <script>
        var btn = document.getElementById('btn');
        btn.onclick = function () {
            history.forward();
        }
    </script>
</body>

</html>

html 复制代码

<html>

<head>
    <title>History Test02</title>
</head>

<body>
    <a href="historyTest01.html">上一页</a>
    <button id="btn">上一页</button>
    <script>
        var btn = document.getElementById('btn');
        btn.onclick = function () {
            history.back();
        }
    </script>

</body>

</html>

二、ES6

ECMAScript 6.0，ES6 是 JavaScript 语言的下一代标准，使得 JavaScript 语言可以用来编写复杂的大型应用程序，成为企业级开发语言。ECMAScript 是 JavaScript 语言的国际标准，JavaScript 是 ECMAScript 的实现。

1.let 关键字

用于声明变量，区别于 var；

let 声明的变量不能重复声明；

let 声明的变量有代码块的概念；

var 中，如果使用未声明的变量，结果是 undefined。但在 let 中会报错。

2.const 关键字

类似于 Java 中的 final，被修饰的变量、引用不可以更改。

三、构造函数创建对象

html 复制代码

<html>

<head>
    <title>Test Javascript</title>
</head>

<body>
    <script>
        function Animal(name, age, sex) {
            this.name = name;
            this.age = age;
            this.sex = sex;
            this.show = function () {
                console.log(this.name + "\t" + this.age + "\t" + this.sex);
            }
        }
        var cat = new Animal("小猫", 2, "雌");
        cat.show();
    </script>
</body>

</html>

四、原型

1.说明

每个对象都有一个原型对象，可以使用原型对象中的所有属性和方法。

html 复制代码

<html>

<head>
    <title>Test Javascript</title>
</head>

<body>
    <script>
        var person = {
            name: '张三',
            age: 18,
            sex: '男',
        }

        // 获取原型对象
        person.__proto__.show = function () {
            console.log('我是原型对象');
        }

        person.show();
    </script>
</body>

</html>

2.继承和继承链

JS 中的继承，就是一个对象继承另一个对象，该对象中拥有另一个对象的属性和方法。JS 对象拥有原型的属性和方法，所以可以通过原型继承实现属性和方法被继承。

html 复制代码

<html>

<head>
    <title>Test Javascript</title>
</head>

<body>
    <script>
        Object.prototype.test = function () {
            console.log("Object 原型的 test 方法被调用");
        }

        function Person(name, age) {
            this.name = name;
            this.age = age;
        }

        function Student(score) {
            this.score = score;
        }

        Student.prototype = new Person("小王", 23);
        var stu = new Student(100);
        console.log(stu.name);
        console.log(stu.age);
        console.log(stu.score);
        stu.test();
    </script>
</body>

</html>