JavaScript 基础第六天

一、引言

  前面我们介绍了有关于内置对象的很多很多的API,讲道理得话如果想彻底的掌握那一定要经过一定的代码段沉淀下。大家可以想象一下,既然在程序中有很多的内置对象供我们使用,那我们是不是也可以定义一些对象作为我们自己的特用对象呢?答案肯定是可以的。

二、导入

  在工作中根据内容需求不同我们可以定义不同的对象来实现我们自己想要的功能。

三、重点内容

  ① 自定义对象的概念:

    在工作当中,有时我们需要多次的定义不同事物的不同属性。这个时候为了方便我们就有了对象把他们封装起来。那么对象是什么呢?。它是一个无序数组的集合,你可以把它当做是你的旅行包,里面装着你的衣服、钱包、手机等的物品。对象可以帮我们封装一些数据,方便我们在程序中的传输或者是控制。我们把在对象中封装的内容就把这些叫做是属性或者方法。

    属性:事物具有的特征

    方法:事物具有的行为

  ② 自定义对象的创建方式:

    1.创建自定义对象:

  var student = new Object();  //创建了一个学生的空对象
    // 属性(特征,姓名,性别,年龄,手机号,家庭)和方法(打招呼,游泳,打球)
    student.name = "张三";
    student.sex = "男";
    student.age = 20;
    student.sayHi = function (){
        console.log("我叫"+student.name+",我今年"+student.age+",我是"+student.sex+"生");
    };

     虽然这样做是没有错误的,但是如果说是要储存一个班的人的信息呢?我们需要一个方式批量创建。

    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;//将这个对象返回
}

var zs = createStudent("张三",25,"男");
zs.sayHi();

var ls = createStudent("李四",26,"男");
ls.sayHi();
var zs1 = createStudent("赵四",28,"男");
zs1.sayHi();

      这样子我们就可以批量的穿件对象了,但是在上面的代码中我们发现 var student = new Object();// 用构造函数的方式创建了一个空对象并返回   return student;//将这个对象返回   这两句是不必须的,所以我们用下面的方法。

     3.构造函数创建对象

function Student(name,sex,age){  //首字母大写,标明是一个函数,但是是构造函数,用来创建对象
    //var this = new Object();
    this.name = name;    // this指代当前创建出来的出来
    this.age=age;
    this.sex = sex;
    this.sayHi = function(){
        console.log("我叫"+this.name+",我今年"+this.age+",我是"+this.sex+"生");
    };
    //return student();
    // return this;
}

var ls = new Student("李四","男",25); // 构造函数可以创建对象并返回
ls.sayHi();

var xm = new Student("小明","男",12);
xm.sayHi();  //谁调用,this就指代谁,始终指向当前对象

    在这里面我们需要关注两个关注的关键字new与this

      new在构造函数的时候做了以下的4件事

        a ) 创建一个空的对象。   

        b )将this指针指向这个对象。

        c )将构造函数里面的代码,给当前空对象this设置属性和方法。

        d )将this这个当前这个对象返回。

      this

       在JS中,通过构造函数创建出来的对象 ,在调用方法的时候,this指代当前对象。

       谁调用方法,this指代谁,都是指代当前对象。

    我知道关于这两个关键字肯定还有更深层的解释,不过这是基础先掌握后面再深入。

    4.对象字面量创建对象

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

四、总结

  今天的内容有些多,需要记忆的内容要求很大。希望大家可以多多记忆。

				
时间: 2024-11-08 13:46:51

JavaScript 基础第六天的相关文章

web前端javaScript基础第六天

目前在从事前端工作,特别总结javaScript基础知识供大家学习,本人特总结一下使用方法献给目前正在学习web前端的小伙伴们,希望你们在前端领域闯出属于自己的一片天空来,需要sublime软件安装包的或者前端资料的,可以加我创建的前端群 937268047 函数:变量作用域:js只有函数能够关住变量的作用域全局变量局部变量:在函数内部声明的变量,只能在函数内部使用 函数的形参是局部变量,形参只能在函数内部使用全局变量作用:一个变量可以被多个函数改变,这个变量一定是全局变量(信号量) 函数作用域

javascript入门书籍推荐《javascript基础教程》

前段时间看javascript高级教程的时候,发现很多基础的javascript概念,自己不懂. 网上搜了一下,看到大家对<javascript基础教程(第8版)>评价不错,买了一本. 作者: (美)Tom Negrino Dori Smith 译者: 陈剑瓯 柳靖 丛书名: 图灵程序设计丛书 出版社:人民邮电出版社 翻开看了后,受益匪浅,决定将这本书推荐给javascript的入门童鞋. 这本书的读者,要有一定的HTML基础,因为javascript基本都是对Dom的操作,所以,有一定的HT

js基础--javascript基础概念之语法

掌握一门语言 必须先掌握它的语法! javascript 的语法和C.Java.Perl 的语法有些相似.但是比它们更加宽松. javascript 中的一切都是严格区分大小写的.例如变量: demo 和 Demo 两个变量是完全不同的. javascript 标示符,所谓标示符 是指 变量.函数.属性 的名字或函数的参数.标示符的格式是按照以下规则组合的一个或多个字符. 1.第一个字符必须是字母,下划线,或 $ 符号. 2.其他字符可以是字母.下划线.$ . 或数字. 注意 不能把关键字 保留

Javascript.01 -- Javascript基础

Javascript基础 1 聊聊Javascript 1.1 Javascript的历史来源 94年网景公司   研发出世界上第一款浏览器. 95年 sun公司   java语言诞生 网景公司和sun合作. Java+script   ===> javascript 1.2 W3c规范 ?结构标准        html ?表现标准   css ?行为标准      js 1.3 JavaScript和ECMAScript的关系 ECMAScript是一种由Ecma国际前身为欧洲计算机制造商协

javascript基础学习(十五)

javascript之cookie 学习要点: cookie介绍 创建与获取cookie cookie的编码 cookie的生存期 cookie的路径 cookie的domain cookie的secure 一.cookie介绍 cookie实际上就是一些信息,这些信息以文件的形式存储在客户端计算机上.在javascript中,cookie主要用来保存状态,或用于识别身份. 二.创建与获取cookie 创建cookie的语法代码如下所示:document.cookie="name=value&q

javascript基础学习(八)

javascript之日期对象 学习要点: 日期对象 将日期对象转换为字符串 将日期对象中的日期和时间转换为字符串 日期对象中的日期 日期对象中的时间 设置日期对象中的日期 设置日期对象中的时间 与毫秒相关的方法 一.日期对象 在javascript中并没有日期型的数据类型,但是提供了一个日期对象可以操作日期和时间. 日期对象的创建: new Date(); 二.将日期对象转换为字符串 将日期对象转换为字符串可以使用以下4种方法: date.toString();//将日期对象转换为字符串时,采

javascript基础学习(二)

javascript的数据类型 学习要点: typeof操作符 五种简单数据类型:Undefined.String.Number.Null.Boolean 引用数据类型:数组和对象 一.typeof操作符 typeof操作符用来检测变量的数据类型,操作符可以操作变量也可以操作字面量. 对变量或值运用typeof操作符得到如下值: undefined----如果变量是Undefined类型: boolean-------如果变量是Boolean类型: number-------如果变量是Numbe

javascript基础语法——词法结构

× 目录 [1]java [2]定义 [3]大小写[4]保留字[5]注释[6]空白[7]分号 前面的话 javascript是一门简单的语言,也是一门复杂的语言.说它简单,是因为学会使用它只需片刻功夫:而说它复杂,是因为要真正掌握它则需要数年时间.实际上,前端工程师很大程度上就是指javascript工程师.前端入门容易精通难,说的是前端,更指的是javascript.本文是javascript基础语法的第一篇——词法结构 与java关系 关于javascript有这样一个说法,java和jav

Javascript基础知识5

不要把相等运算符(==)与赋值运算符(=)搞混. 以&&运算符隔开的两个条件中的前者为错,则不会检测第二个条件的真假.利用这一点,可以提高脚本的速度. 使用带switch的多个条件 if(button=="next") window.location = "next.html"; else if(button=="previous") window.location = "pre.html"; else if(