• JS基础学习08


    今天主要学习到的是对象的概念及对象的创建。

    22. 基本包装类型

    昨天在学习JS中内置的对象时,字符串作为基本数据类型也具备对象的属性和方法,这里就是讲字符串变成了基本包装类型。

    而在基本包装类型调用时会经过以下几个步骤:

    1 先生成一个临时的基本包装类型的对象,var temp = new String();

    2 使用这个临时创建的对象,调用临时对象的属性和方法。

    3 调用完毕之后,立即消毁,temp = null;

    通过上面的三个步骤使字符串具备了对象的属性和方法。

    23. 对象的概念和作用

    23.1 概念

    对象就是存储一类事件的特征和行为的集合,或是键值对的集合。

    由事件的特征构成对象的属性,由事件的行为构成对象的方法。

    23.2 作用

    1 可以帮助我们封装一类数据,并方便我们对这些数据的传输和控制。

    2 可以帮助我们描述一类事物。

    24. 创建自定义的对象

    24.1 使用Object构造函数来创建对象

    var student = new Object();  //使用内置的构造函数创建一个对象名为学生的空对象。
    student.name = "张三";//给对象赋予属性和属性值。
    student.sex = "男";
    student.age = 20;
    student.sayHi = function (){//给对象赋予方法名和方法值。
        console.log("我叫"+student.name+",我今年"+student.age+",我是"+student.sex+"生");
    };
    student.sayHi();//通过对象名.方法的方式来调用对象方法。

    但是如果同时需要创建多个一类的对象,使用上述方法创建对象会出现代码的冗余,严重影响程序的运行速度。

    所以我们将上述代码封装在一个函数中,用于批量创建同类型的对象。

    24.2 批量创建对象

    function  createStudent(name,age,sex){
        var student = new Object();//每进行一次函数的调用都会使用内置的构造函数创建一个对象名为学生的空对象。
        student.name =name;
        student.age = age;
        student.sex= sex;
        student.sayHi= function(){
            console.log("我叫"+student.name+",我今年"+student.age+",我是"+student.sex+"生");
        };
        return student;//每进行一次函数的调用都需要将创建对象返回。
    }

    但是在这个封装函数内还是存在会重复使用的代码。

    24.3 创建构造函数

    我们可以创建一个自定义的构造函数,并通过这个构造函数来创建对象。

    function Student(name,sex,age){  //我们自己定义一个构造函数,用来创建我们需要的对象。
        this.name = name;    // this关键字指代使用这个构造函数创建出来的对象。
        this.age=age;
        this.sex = sex;
        this.sayHi = function(){
            console.log("我叫"+this.name+",我今年"+this.age+",我是"+this.sex+"生");
        };
    }
    var ls = new Student("李四","男",25); // 使用这个构造函数创建对象并返回。
    ls.sayHi();

    这里涉及到了两个关键字的使用,一个为new关键字,一个为this关键字。

    24.4 this关键字的作用

    在JS中,通过构造函数创建对象时,构造函数中的this关键字就会指代创建时的对象名。

    24.5 new关键字的作用

    在使用new关键字调用构造函数创建对象的时候,new 键字会完成下面4个步骤:
    1 使用构造函数创建一个空对象。
    2 将关键字this指向这个空对象。
    3 执行构造函数里面的代码,给当前空对象this设置属性和方法。
    4 将this这个当前对象返回。

    25. 通过对象字面量创建对象

    我们可以通过var o = {};的方式创建一个空对象,这种就是对象字面量的创建方式。

    var o = {   
        name:"张三",
        age:20,
        address:"上海市",
        sex:"男",
        sayHi:function(){
            console.log("大家好,我的名字是:"+ this.name+",我的年龄是:"+ this.age+",我是"+ this.sex+"生");
        }
    };
    o.sayHi();

    26. JSON

    JSON就是JavaScript对象表现形式,而JSON对象的创建方式与通过对象字面量创建对象的方式相类似,区别在于JSON对象需要在创建的属性上加双引号。

    var o1 = {    //JSON对象
        "name":"张三",
        "age":20,
        "address":"上海市",
        "sex":"男",
        "sayHi":function(){
            console.log("大家好,我的名字是:"+ this.name+",我的年龄是:"+ this.age+",我是"+ this.sex+"生");
        }
    };

    JSON对象的作用为传输数据的一种数据格式,可以用来与后台的数据传输。

  • 相关阅读:
    Maven安装与环境配置(Windows)
    Java配置----JDK开发环境搭建及环境变量配置
    js中的join(),reverse()与 split()函数用法解析
    Vue2.0 搭建Vue脚手架(vue-cli)
    vue: WebStorm设置快速编译运行
    优秀博客推荐
    Springboot读取自定义配置文件节点
    vue——报错:Cannot read property '__ob__' of undefined
    css——内容溢出显示垂直滚动条,内容不超出就不显示滚动条
    js——实现多选
  • 原文地址:https://www.cnblogs.com/chendu/p/5734973.html
Copyright © 2020-2023  润新知