的函数原型_JavaScript中的构造函数和原型!

3c9d0961c0eead463cba6ce85b6107b4.png

JavaScript中的原型!原型的内容是涉及到JavaScript中的构造函数的每一个构造函数都有一个原型对象!prototype他的作用是 共享方法!每一个实例化的对象都有一个对象原型__proto__他指向的是构造函数的原型对象所以我们创建的实例对象可以使用对象原型中的方法!__proto__对象原型和原型对象prototype是等价的__proto__对象原型的意义就在于为对象的查找机制提供一个方向,或者说一条路线,但是它是一个非标准属性,因此实际开发中,不可以使用这个属性,它只是内部指向原型对象prototype
看不见我, 看不见我,看不见我!构造函数!对象原型(proto)和原型对象(prototype)里面都有一个constructor属性!, constructor我们称之为构造函数, 因为它指回构造函数本身!constructor主要用于记录该对象引用于哪个构造函数,它可以让原型对象重新指向原来的构造函数
<script> // 构造函数的问题! function Gouzaohanshu(name, age, gender) { this.name = name; this.age = age; this.gender = gender; // this.hanshu = function() { // console.log(123) // } } // 把构造函数放到我们的原型对象身上! // Gouzaohanshu.prototype.hanshu = function () { // console.log(123) // } //很多情况下,我们需要手动的利用 constructor这个属性指固原来的构造函数 // Gouzaohanshu.prototype.sleep = function() { // console.log("我想睡觉!") // } // 如果对象比较多, 那么我们就可以采取对象的形式存储! // 但是如果你这样做的话会把原先的原型对象给覆盖了! // 原先的原型对象就不会指向上面的构造函数了! // 解决方法 // 在下面的对象中添加这样一句代码! // construtor: Gouzaohanshu, // 就可以让构造函数指回他的本身了! // 一句话, 如果我们修改了原来的原型对象, 给原型对象赋值是一个对象, 则必须手动的利用constructor 指回原来的构造函数! Gouzaohanshu.prototype = { construtor: Gouzaohanshu, hanshu() { console.log(123) }, sleep: function() { console.log("我想睡觉!") } } var gz = new Gouzaohanshu('lvhang', 23, 'nan'); // 在我们创建的对象身上也有一个对象叫做! // __prototype__ 叫做对象的原型! // 它指向我们构造函数的原型对象! var gz2 = new Gouzaohanshu('lvhang', 23, 'nan'); gz.hanshu() // __proto__对象的原型和原型对象prototype是等价的 console.log(gz.__proto__ === Gouzaohanshu.prototype); // true // 方法的查找规则:首先先看gz对象身上是否有hanshu方法,如果有就执行这个对象上的hanhsu方法 // 如果没有这个方法,因为有__proto__,就去构造函数原型对 Prototype身上去查找 // constructor主要用于记录该对象引用于哪个构造函数,它可以让原型对象重新指向原来的构造函数 console.log(gz.__proto__); console.log(Gouzaohanshu.prototype); </script>

91054d85395c84af469ba14e250c0e66.png
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
探索全栈前端技术的魅力:HTML+CSS+JS+JQ+Bootstrap网站源码深度解析 在这个数字化时代,构建一个既美观又功能强大的网站成为了许多开发者和企业追逐的目标。本份资源精心汇集了一套完整网站源码,融合了HTML的骨架搭建、CSS的视觉美化、JavaScript的交互逻辑、jQuery的高效操作以及Bootstrap的响应式设计,全方位揭秘了现代网页开发的精髓。 HTML,作为网页的基础,它构建了信息的框架;CSS则赋予网页生动的外观,让设计创意跃然屏上;JavaScript的加入,使网站拥有了灵动的交互体验;jQuery,作为JavaScript的强力辅助,简化了DOM操作与事件处理,让编码更为高效;而Bootstrap的融入,则确保了网站在不同设备上的完美呈现,响应式设计让访问无界限。 通过这份源码,你将: 学习如何高效组织HTML结构,提升页面加载速度与SEO友好度; 掌握CSS高级技巧,如Flexbox与Grid布局,打造适应各种屏幕的视觉盛宴; 理解JavaScript核心概念,动手实现动画、表单验证等动态效果; 利用jQuery插件快速增强用户体验,实现滑动效果、Ajax请求等; 深入Bootstrap框架,掌握移动优先的开发策略,响应式设计信手拈来。 无论是前端开发新手渴望系统学习,还是资深开发者寻求灵感与实用技巧,这份资源都是不可多得的宝藏。立即深入了解,开启你的全栈前端探索之旅,让每一个网页都成为技术与艺术的完美融合!
探索全栈前端技术的魅力:HTML+CSS+JS+JQ+Bootstrap网站源码深度解析 在这个数字化时代,构建一个既美观又功能强大的网站成为了许多开发者和企业追逐的目标。本份资源精心汇集了一套完整网站源码,融合了HTML的骨架搭建、CSS的视觉美化、JavaScript的交互逻辑、jQuery的高效操作以及Bootstrap的响应式设计,全方位揭秘了现代网页开发的精髓。 HTML,作为网页的基础,它构建了信息的框架;CSS则赋予网页生动的外观,让设计创意跃然屏上;JavaScript的加入,使网站拥有了灵动的交互体验;jQuery,作为JavaScript的强力辅助,简化了DOM操作与事件处理,让编码更为高效;而Bootstrap的融入,则确保了网站在不同设备上的完美呈现,响应式设计让访问无界限。 通过这份源码,你将: 学习如何高效组织HTML结构,提升页面加载速度与SEO友好度; 掌握CSS高级技巧,如Flexbox与Grid布局,打造适应各种屏幕的视觉盛宴; 理解JavaScript核心概念,动手实现动画、表单验证等动态效果; 利用jQuery插件快速增强用户体验,实现滑动效果、Ajax请求等; 深入Bootstrap框架,掌握移动优先的开发策略,响应式设计信手拈来。 无论是前端开发新手渴望系统学习,还是资深开发者寻求灵感与实用技巧,这份资源都是不可多得的宝藏。立即深入了解,开启你的全栈前端探索之旅,让每一个网页都成为技术与艺术的完美融合!

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值