Java教程

JavaScript-笔记7

本文主要是介绍JavaScript-笔记7,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

一、this

解析器在调用函数时,每次都会向函数内部传递一个隐含的参数,这个隐含的参数就是this,this指向的是一个对象,这个对象被称为函数执行的上下文对象,根据函数的调用方式不同,this会指向不同的对象。(谁调用就指向谁

1.以函数的形式调用时,相当于 window.函数名(),this就是window

2.以方法的形式调用时,相当于 对象.函数名(),this就是调用方法的那个对象

3.以构造函数的形式调用时,this就是新创建的那个对象

        var name = "全局";

        function fun() {
            console.log(this.name);
        }
        var obj = {
            name: "孙悟空",
            sayName: fun
        };
        var obj2 = {
            name: "沙和尚",
            sayName: fun
        };
        fun();
        obj2.sayName();

二、使用工厂方法创建对象

通过该方法可以大批量创建对象

        function createPerson(name, age, gender) {
            var obj = new Object();
            obj.name = name;
            obj.age = age;
            obj.gender = gender;
            obj.sayName = function() {
                alert(this.name);
            };
            return obj;
        }
        var obj2 = createPerson("猪八戒", 18, "男");
        var obj3 = createPerson("孙武", 16, "男");
        var obj4 = createPerson("张大娘", 38, "女");
        console.log(obj2);
        console.log(obj3);
        console.log(obj4);
        obj4.sayName();

使用工厂方法创建的对象,使用的构造函数都是Object,所以创建的对象都是Object这个类型,导致无法区分出多种不同类型的对象

三、构造函数

构造函数是用来创建对象的函数

如,创建一个构造函数,专门用来创建Person对象

构造函数就是一个普通的函数,创建方式和普通函数没有区别,不同的是,构造函数习惯上首字母大写

构造函数和普通函数的区别就是调用方式的不同,普通函数是直接调用,而构造函数需要使用new关键字来调用

        var per = Person(); //作为普通函数调用
        var per = new Person(); //作为构造函数调用

构造函数的执行流程:

1.立刻创建一个新的对象

2.将新建的对象设置为函数中的this,在构造函数中可以使用this来引用新建的对象

3.逐行执行函数中的代码

4.将新建的对象作为返回值返回

*当函数以构造函数的形式调用时,this就是新创建的那个对象

使用同一个构造函数创建的对象,我们称为一类对象,也将一个构造函数称为一个类。我们将通过一个构造函数创建的对象,称为该类的实例

        // Person构造函数,也称为Person类
        function Person(name, age, gender) {
            this.name = name;
            this.age = age;
            this.gender = gender;
            this.sayName = function() {
                alert(this.name);
            };
        }

        function Dog() {

        }
        var per = new Person("孙悟空", 18, "男");
        var dog = new Dog();
        console.log(per);
        console.log(dog);

使用 instanceof 运算符 可以检查一个对象是否是一个类的实例,如果是,则返回true,否则返回false

语法:

对象 instanceof 构造函数

        console.log(per instanceof Person);

*所有的对象都是Object的后代,所以任何对象和Object做instanceof检查时都会返回true

四、构造函数优化

在Person构造函数中,为每一个对象都添加了一个sayName方法

目前sayName方法是在构造函数内部创建的,也就是构造函数每执行一次,就会创建一个新的sayName方法,也就是所有实例的sayName都是唯一的

 console.log(per.sayName == per2.sayName);//false

这样就导致了构造函数执行多次就会创建多个功能相同却又独立的方法,而这没有必要,完全可以使所有的对象共享同一个方法:

        function Person(name, age, gender) {
            this.name = name;
            this.age = age;
            this.gender = gender;
            this.sayName = fun;
        }
        // 将sayName方法在全局作用域中定义
        function fun() {
            alert("大家好,我是" + this.name);
        };

将sayName方法在全局作用域中定义

但将函数定义在全局作用域中,污染了全局作用域的命名空间,而且定义在全局作用域中也很不安全

五、原型prototype

我们所创建的每一个函数,解析器都会向函数中添加一个属性prototype,这个属性对应着一个对象,这个对象就是我们所谓的原型对象

如果函数作为普通函数调用prototype没有任何作用,当函数以构造函数的形式调用时,它所创建的对象中都会有一个隐含的属性,指向该构造函数的原型对象,可以通过 __proto__ 来访问该属性。

原型对象就相当于一个公共的区域,所有同一个类的实例都可以访问到这个原型对象,因此我们可以将对象中共有的内容统一设置到原型对象中。

当访问对象的一个属性或方法时,它会先在对象自身中寻找,自身如果有则直接使用,如果没有则会去原型对象中寻找,如果原型对象中有则直接使用,如果没有则去原型的原型中寻找,直到找到Object对象的原型,Object对象的原型没有原型,如果在Object的原型中依然没有找到,则返回undefined。

console.log(Object.prototype.prototype); //undefined

构造函数再优化:

*以后创建构造函数时,可以将这些对象共有的属性和方法统一添加到构造函数的原型对象中

        function Person(name, age, gender) {
            this.name = name;
            this.age = age;
            this.gender = gender;
        }
        // 在原型中添加sayName方法
        Person.prototype.sayName = function() {
            alert("大家好,我是" + this.name);
        };

原型

使用 in 检查对象中是否含有某个属性时,如果对象中没有但是原型中有,也会返回true

console.log("name" in mc); //true

可以使用对象的 hasOwnProperty() 来检查对象自身中是否含有该属性,只有当对象自身中含有该属性时,才会返回true。

console.log(mc.hasOwnProperty("name")); //false

原型对象也是对象,所以它也有原型

hasOwnProperty() 方法在原型的原型中

console.log(mc.__proto__.__proto__.hasOwnProperty("hasOwnProperty")); //true

六、toString

当我们直接在页面中输出一个对象时,实际上输出的是对象的 toString() 方法的返回值(chrome会直接输出对象内容),实际上 toString() 方法在object的原型中,其返回值即为 [object Object] ,如果希望在输出对象时不输出 [object Object] ,可以为对象的原型添加一个toString() 方法,return需要的内容

七、垃圾回收(GC)

程序运行过程中会产生垃圾,垃圾积攒过多,会导致程序运行速度过慢,所以需要一个垃圾回收的机制,来处理程序运行过程中产生的垃圾

        var obj = new Object();
        ...
        ...
        obj = null; //obj这一变量不再指向堆内存中的对象

当一个对象没有任何变量或属性对它进行引用,此时我们将永远无法操作该对象,此时这种对象就是垃圾,这种对象过多会占用大量的内存空间,导致程序运行变慢,所以这种垃圾必须进行清理。

在JS中拥有自动的垃圾回收机制,会自动将这些垃圾对象从内存中销毁,我们不需要也不能进行垃圾回收的操作

我们需要做的只是将不再使用的对象设置为 null 即可( 变量 = null; 如果没有这行代码不会被回收)

这篇关于JavaScript-笔记7的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!