【JS高级 - 面向对象5（继承，引用）】的更多相关文章

探讨 JS 的面向对象中继承的那些事

最近学了 JS 的面向对象,这篇文章主要是探讨 JS 的面向对象中继承的那些事. JS中继承的特点: 1.子类继承父类: 2.子类可以用父类的方法和属性 3.子类的改变可以不影响父类 下面用一个例子来说明 JS 的继承 这段代码创建了一个父类以及它的原型,同时还创建了一个子类,并继承了父类的私有属性 <script> //这是父类 function Father(name,age,marry){ this.name=name; this.age=age; this.marry=marry; }…

js高级-面向对象继承

一.工厂模式创建对象及优缺点 继承就是把公共的部分抽象出来作为父类,基类.吃饭,跑步等 var a = {}; //批量创建不方便,不能重复设置公共属性的代码 //工厂模式出现了,创建10个Cat对象 每个对象都有年龄.姓名的属性,包括run方法 注意区分 js高级-函数的四种调用模式 function createCat(age,name){ var o = new Object(); o.age = age; o.name = name; o.run = function (){ conso…

JS高级 - 面向对象5（继承，引用）

<script type="text/javascript"> //------------------Person类 //(Person)的构造函数 function Person(name, sex) { this.name = name; this.sex = sex; } Person.prototype.showName = function() { console.log(this.name) }; Person.prototype.showSex = func…

JS高级 - 面向对象1（this，Object ，工厂方式，new ）

面向对象三要素: 封装 继承 多态 1.this 详解,事件处理中this的本质 window this -- 函数属于谁 <script type="text/javascript"> var arr=[12,65,87]; //this:当前的方法,属于谁 arr.show =function (argument) { // body... console.log(this); //[12,65,87] } arr.show(); function show(){ co…

JS高级---逆推继承看原型

逆推继承看原型 function F1(age) { this.age = age; } function F2(age) { this.age = age; } F2.prototype = new F1(10); function F3(age) { this.age = age; } F3.prototype = new F2(20); var f3 = new F3(30); console.log(f3.age);//…

JS高级---面向对象的编程思想（贪吃蛇梳理）

面向对象的编程思想(贪吃蛇梳理) 模拟贪吃蛇游戏,做的项目 地图: 宽,高,背景颜色,因为小蛇和食物都是相对于地图显示的, 这里小蛇和食物都是地图的子元素, 随机位置显示, 脱离文档流的, 地图也需要脱离文档流--css需要设置:宽, 高, 背景颜色, 脱标 食物---div元素 elements--->存储div的数组(将来删除的食物div时候, 先从map中删除div, 再从数组中移除div) 食物: 宽, 高, 背景颜色, 横坐标, 纵坐标 一个食物就是一个对象, 这个对象有相应的属性,…

JS高级 - 面向对象4（json方式面向对象）

把方法包在一个Json里 var p1 = { name: "唐三", sex: "男", dreamdu: { URL: "www.dreamdu.com", name: "梦之都", author: "monkey", say: function() { document.write(this.name + " say hello") } //允许嵌套 }, showName: fu…

JS高级 - 面向对象3（面向过程改写面向对象）

改写: 1.前提:所有东西都在 onload 里 2.改写:不能有函数嵌套,可以有全局变量 onload --> 构造函数 全局变量 --> 属性 函数 --> 方法 4.改错: this this啥时候会出问题? 1.定时器 <script> function Aar() { this.a = 12; setInterval(this.show, 1000); //这里的this 是window } Aar.prototype.show = function() { con…

JS高级 - 面向对象2（prototype定义）

定义和用法 prototype 属性允许您向对象添加属性和方法 注意: Prototype 是全局属性,适用于所有的Javascript对象. 语法 object.prototype.name=value <script> function employee(name,jobtitle,born){ this.name=name; this.jobtitle=jobtitle; this.born=born; } var fred=new employee("Fred Flintst…

JS高级——面向对象方式解决tab栏切换问题

注意事项 1.给li元素注册事件,函数里面的this指的li元素,那么我们可以在注册事件之前将Tab对象用that=this进行保存 2.使用沙箱模式,所以暴露给外面的变量使用的是window.tab,将window作为参数传递进去 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title>…