web学习笔记(二十一)

目录

1.构造函数创建对象

1.1规则

1.2 new关键字调用构造函数时,函数内部做了什么事情?

1.3总结

2.混合模式创建对象

3.JavaScript 继承---借助构造函数

 4.原型链

4.1原型链实现方法继承

5.完美的组合继承

6.call方法的使用


1.构造函数创建对象

1.1规则

(1)构造函数----函数名的首字母要大写eg:Person

 function Student(name, age, gender, no) {this.name1 = name;// 前者是新定义的属性名,后者是我们传进来的形参//绑定属性  this.属性名=属性值(形参上的变量)//属性名和形参的变量可以一致也可以不一致this.age1 = age;this.gender1 = gender;this.no1 = no;this.say1 = function () {console.log(this.name1 + 'is saying');}}var si=new Student('张三','20岁','大一','男');var s2=new Student('李四','22岁','大三','女');var s3=new Student('王五','20岁','大一','女');

  (2)函数内部的实现

         函数内的属性和方法前面需要添加this,表示当前对象的属性和方法

         构造函数中不需要return返回结果

 (3)调用函数

       var 实例对象= new 构造函数名() 

1.2 new关键字调用构造函数时,函数内部做了什么事情?

       (1)在函数内部创建一个空对象-----函数内没写,系统帮忙完成的

       (2)让this指向这个空对象

        (3)执行构造函数内部的代码,在对象上添加属性和方法

        (4)把对象返回----函数内没写return,系统帮忙完成的

1.3总结

  • 构造函数用于创建某一类对象,其首字母要大写。
  • 构造函数要和 new 一起使用才有意义。
  • 构造函数约定首字母大写。
  • 函数内的属性和方法前面需要添加 this ,表示当前对象的属性和方法。
  • 构造函数中不需要 return 返回结果。
  • 当我们创建对象的时候,必须用new 来调用构造函数。

2.混合模式创建对象

和构造函数创建对象很像,但混合模式创建对象比构造函数创建对象要好一点,以后应用会更多一点

继承-原型继承 --prototype

之前构造函数创建方法都是this.方法,现在我们使用混合函数创造方法都是把方法从对象里面拎出来,然后通过对象.prototype.方法名=function(){}来创建方法,相当于我们把方法放到了一个公共的区域,大家在调用方法时都是调用同一个方法。

<script>function Person(name, age) {this.name = name;this.gae = age;}Person.prototype.say = function () {console.log(this.name + 'is saying');}Person.prototype.test = function () {console.log(this.name + 'is testing');}var p1 = new Person('张武', 18);var p2 = new Person('李四', 20);p1.test();p2.test();// 这两个方法是同一个,相当于开发了同一个系统</script>
  • JavaScript 是面向对象的语言,但JavaScript不使用类。
  • 在 JavaScript中,不会创建类,也不会通过类来创建对象(就像在其他面向对象的语言中那样)。
  • JavaScript基于prototype, 而不是基于类(构造函数名)的。

3.JavaScript 继承---借助构造函数

        继承就是查找属性和方法的一种机制,先从自身(自己的构造函数)来查,如果有就直接用,如果没有,再从它继承的构造函数中查,直到找到为止,如果一直找不到,方法会报错,属性输出undefined,此时只能继承父构造函数中的方法,而不能继承父构造函数原型上的方法,想要继承父构造函数上的继承方法需要使用原型链来继承。

继承者------子类  派生类

被继承者-----父类   超类 基类

继承父类的方法:   父构造函数.call(this,实参1,实参2)

括号内第一个参数是对象,不一定是this,后续可以进行更换。

             Father.call(this, name, age,say)//Father.call 是调用了父构造函数   this对象 指向是儿子的实例对象  
// name,age是传的实参,在父亲构造函数中借用name和age属性

继承父类的例子:

 <script>//父类function Father(name, age) {this.name = name;this.age = age;this.say = function () {console.log('saying');}}//子类function Son(name, age, no, xueli) {// 继承父亲中的属性和方法Father.call(this, name, age,say)//Father.call 是调用了父构造函数       this对象 指向是儿子的实例对象   //name,age是传的实参,在父亲构造函数中借用name和age属性this.no = no;this.xueli = xueli;this.test = function () {console.log('testing');}}var s1=new Son('廉颇', '20', '1000','本科');console.log(s1.name,s1.age,s1.no,s1.xueli);</script>

 4.原型链

        原型链就是在原型上查方法,是一种查找方法的查找机制。先从自己的原型去查找,如果有方法,就是用,如果没有就向继承的父级对象去查,然后一直沿着原型对象一直向上查,找到就使用,找不到就报错

原型里面大部分放的都是方法,构造函数里面放置基本的属性。

constructor:构造器属性,可以通过这个查找出该原型的构造器

4.1原型链实现方法继承

(1)方法一:子构造函数.prototype=new 父构造函数();
  这个方法不太好用,让会儿子的原型上同时拥有了父亲的属性和方法。此时通过.pototype.constructor查找出来子构造函数的this指向为父构造函数。可以通过回指来解决这个问题:子构造函数.prototype.constructor=子构造函数;

(2) 方法二:子构造函数.prototype=Object.create(父构造函数.prototype); 

5.完美的组合继承

就是借助构造函数然后加上原型链,从而形成完美的组合继承。

父构造函数名.call(this,实参一,实参二);

子构造函数名.prototype=Object.create(父构造函数名.prototype);

子构造函数名.prototype.constructor=子构造函数名;

6.call方法的使用

函数名.call方法是函数的内置方法。无参时和直接调用函数的作用一样。

    function text1(){console.log('aaa');}text1();text1.call();

有参数时:参数一是对象(必传)。参数二及后面是函数的实参,以逗号分割依次传递。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/712994.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

React之数据绑定以及表单处理

一、表单元素 像<input>、<textarea>、<option>这样的表单元素不同于其他元素&#xff0c;因为他们可以通过用户交互发生变化。这些元素提供的界面使响应用户交互的表单数据处理更加容易 交互属性&#xff0c;用户对一下元素交互时通过onChange回调函数来监听…

回溯例题(leetcode17/37)

文章目录 leetcode37leetcode17 回溯跟枚举差不多。要注意“回溯”&#xff0c;别忘记“回”之前把之前的改动都复原。 leetcode37 leetcode37是解数独问题。本题保证有且仅有唯一解。 思路&#xff1a;先把空格子的位置存下来&#xff0c;然后对每一个空位置挨个枚举1-9。枚…

Excel常用公式总结非常实用

16个最实用的Excel万能公式 1、多条件判断 IF(And(条件1,条件2..条件N),条件成立返回值) IF(or(条件1,条件2..条件N),条件成立返回值) 2、多条件查找 Lookup(1,0/((条件1*条件2*...条件N)),返回值区域&#xff09; 3、多条件求和 Sumifs(值区域,判断区域1,条件1,判断区域2,条…

2024最新精华版Java面试题之spring篇

目录 一、Java面试题之spring篇 1、什么是spring? 2、你们项目中为什么使用Spring框架&#xff1f; 3、 Autowired和Resource关键字的区别&#xff1f; 4、依赖注入的方式有几种&#xff0c;各是什么? 5、讲一下什么是Spring容器&#xff1f; 6、说说你对Spring MVC的理…

Java毕业设计-基于springboot开发的私人健身与教练预约系统-毕业论文+答辩PPT(有源代码)

文章目录 前言一、毕设成果演示&#xff08;源代码在文末&#xff09;二、毕设摘要展示1.开发说明2.需求分析3、系统功能结构 三、系统实现展示1、系统功能模块2、后台功能模块2.1管理员功能2.2用户功能2.3教练功能 四、毕设内容和源代码获取总结 [Java毕业设计-基于springboot…

简单数据类型和复杂数据类型

1. 简单数据类型 null是个特例: 2. 复杂数据类型 3. 堆和栈 注意&#xff1a; JavaScript 中是没有堆和栈的概念的&#xff0c;通过堆栈的概念可以更好的理解代码的一些执行方式&#xff0c;便于将来学习其他语言。 4. 简单数据类型传参 总结&#xff1a;简单数据类型传参传…

在线ai写作,让你随时随地创作优质内容

如今的ai技术已经渗透到我们生活的方方面面。其中&#xff0c;AI写作成为了一个备受关注的领域。如今&#xff0c;我们可以利用在线ai写作在任何时间、任何地点创作出优质的内容。 传统的写作过程需要大量的时间和精力。从构思到写作再到修改&#xff0c;每一个环节都需要我们投…

Linux进程管理——top字段

目录 1.top下半部分——进程状态 2.top常用内部命令 3.top指定 ①top ②top -d 1 ③top -d 1 -p 10126 ④top -d 1 -p 10126,1 4.使用信号控制进程 1.top下半部分——进程状态 PID&#xff1a;进程号 User&#xff1a;用户 PR/NI&#xff1a;优先级 VIRT&#xff08…

国产软件很流氓?不,这些国产软件良心且实用,别让它们寒心

谈及国产软件&#xff0c;人们常将其与“流氓、捆绑、满屏广告”等负面词汇挂钩。但真实情况是&#xff0c;仍有许多优质国产软件在默默耕耘&#xff0c;它们既免费又实用&#xff0c;别让它们寒了心。 1、Dism Dism是一款专为Windows系统设计的管理优化神器&#xff0c;其开…

呦呵,阿里云果然是良心云

关注卢松松&#xff0c;会经常给你分享一些我的经验和观点。 你听说了吗?阿里云全线降价20%&#xff0c;还上了热搜。2024年一开年&#xff0c;看来阿里云杀红了眼&#xff0c;云市场即将变天。 现在续费的阿里云主机&#xff0c;续费三年和续费两年的价钱差不多&#xff0…

更先进的功能,无注意力大模型Eagle7B:基于RWKV,推理成本降低10-100 倍,另一个工具包使得大模型推理性能加速达40倍(附详细代码使用举例)

更先进的功能,无注意力大模型Eagle7B:基于RWKV,推理成本降低10-100 倍,另一个工具包使得大模型推理性能加速达40倍(附详细代码使用举例)。 在 AI 赛道中,与动辄上千亿参数的模型相比,最近,小模型开始受到大家的青睐。比如法国 AI 初创公司发布的 Mistral-7B 模型,其…

摄像头工程师说 Camera - 颜色空间 YUV 与 YCbCr 的区别与联系(4)

摄像头工程师说 Camera - 数据格式 YUV 与 YCbCr 的区别与联系&#xff08;4&#xff09; 概述 上回书咱们说到 摄像头工程师说 Camera - 数据格式 YUV 格式的存储&#xff08;3&#xff09; 本节咱们说说YUV 与 YCbCr 两种色彩空间定义的联系与区别。 相同点&#xff1a; Y…

MySQL基础(三)

文章目录 MySQL基础&#xff08;三&#xff09;1. 多表查询1.1 概述1.1.1 数据准备1.1.2 介绍1.1.3 分类 1.2 内连接1.3 外连接1.4 子查询1.4.1 介绍1.4.2 标量子查询1.4.3 列子查询1.4.4 行子查询1.4.5 表子查询 1.5 案例 2. 事务2.1 介绍2.2 操作2.3 四大特性 3. 索引3.1 介绍…

Java-常用集合

Jva常用集合 一、Java 集合框架体系二、Collection接口和方法1. List接口List 接口主要实现类&#xff1a;ArrayListList 的实现类之二&#xff1a;LinkedListList 的实现类之三&#xff1a;Vector 2. Set接口Set 主要实现类&#xff1a;HashSetSet 实现类之二&#xff1a;Link…

HCIA-Datacom实验指导手册:7 构建简单 IPv6 网络

HCIA-Datacom实验指导手册&#xff1a;7 构建简单 IPv6 网络 一、实验介绍&#xff1a;二、实验拓扑&#xff1a;三、实验目的&#xff1a;四、配置步骤&#xff1a;步骤 1 设备基础配置设备命名 步骤 2 配置设备及接口 IPv6 功能步骤 3 配置接口的 link-local 地址&#xff0c…

《C++进阶--10.多态》

目录 10. 多态 10.1 多态的基本概念 10.2 多态案例一-计算器类 10.3 纯虚函数和抽象类 10.4 多态案例二-制作饮品 10.5 虚析构和纯虚析构 10.6 多态案例三-电脑组装 10. 多态 10.1 多态的基本概念 多态是C面向对象三大特性之一 多态分为两类 静态多态: 函数重载 和 运算…

全网爆火的 MBTI 测试,是隐藏的割韭菜工具?

小伙伴们&#xff0c;谁能想到&#xff0c;作为一名冲浪老手&#xff0c;果子在网上又被骗了。 事情是这样的&#xff0c;前几天&#xff0c;我刷微博&#xff0c;看到一个推荐&#xff0c;大概如下图&#xff0c;是一个 MBTI 人格测试。 MBTI 测试&#xff0c;果子早就做过了…

UCSF DOCK 分子对接详细案例(01)- rigid, fixed anchor, flexible dock

欢迎浏览我的CSND博客&#xff01; Blockbuater_drug …点击进入 文章目录 前言一、操作环境二、研究背景三、受体-配体结构文件准备3.1准备文件夹DOCK_workdir, 下载晶体结构3.1.1 来自湿实验的受体配体共晶结构&#xff1a;3.1.2 来自深度学习和语言模型推理预测的蛋白结构&a…

Spring Boot整合Kafka

文章目录 1. 介绍2. Kafka基础2.1. 安装KafKakafka集群搭建_kafka交流群-CSDN博客 3. Spring Boot整合Kafka3.1. 引入Kafka依赖3.2.编写配置文件 4. 生产者&#xff08;produced&#xff09;4.1. 生产者基础案例(基础测试) 5. 消费者5.1.消费者基本案例(基础测试) 6.Kafka常用配…

【LLM RAG】GritLM:统一嵌入和生成的大语言模型浅谈

前言 目前&#xff0c;所有基于文本的语言问题都可以归结为生成问题&#xff0c;并通过单一的LLM来处理。然而&#xff0c;使用嵌入的任务&#xff08;如聚类或检索&#xff09;在这种视角下往往被忽视了。文本嵌入在许多关键的实际应用中扮演着重要角色。如RAG&#xff0c;在…