mg4377娱乐娱城官网_mg4377娱乐手机版_www.mg4377.com

当前位置: mg4377娱乐娱城官网 > www.mg4377.com > 正文

js面向对象编制程序,js面向对象编制程序的有些

时间:2019-08-09 23:31来源:www.mg4377.com
js面向对象编制程序的一部分笔记,在js中面向对象有一点像java或c 中的一样了,下边笔者来给大家整理一些js面向对象编制程序的一些笔记,希望对我们会具备协理。 javascript面向对象

js面向对象编制程序的一部分笔记,在js中面向对象有一点像java或c 中的一样了,下边笔者来给大家整理一些js面向对象编制程序的一些笔记,希望对我们会具备协理。

javascript面向对象编制程序

JavaScript的具有数据都能够用作对象,那是否大家早已在选用面向对象编制程序了啊?

javascript面向对象编制程序

在重重后台语言如c ,java,php等都是面向对象的编制程序语言,js当中,面向对象是相当不够完美的,就算js在那之中有众多对象,不过面向对象无法和对象划等号,所在此以前几日作者给我们具体解说一下js个中的面向对象

在面向对象编制程序里,程序是由对象构成的。js的面向对象编制程序中,对象是由属性构成的,未有类的定义。

本来不是。假诺我们只使用NumberArraystring以及基本的{...}概念的目的,还不能够发挥出面向对象编制程序的威力。

在面向对象编制程序里,程序是由对象构成的。js的面向对象编制程序中,对象是由属性构成的,没有类的定义。

一.什么叫面向对象

1.对象

JavaScript的面向对象编程和超越61%其余语言如Java、C#的面向对象编制程序都不太一致。即便你熟识Java或C#,很好,你早晚知道面向对象的多少个基本概念:

1.对象

回顾的说,面向对象有三大特色:封装,承继,多态

概念:冬天属性的晤面,其属性能够蕴含基本值、对象或然函数。

  1. 类:类是目的的类型模板,举例,定义Student类来表示学生,类本人是一种档次,Student表示学生体系,但不意味其他现实的有些学生;

  2. 实例:实例是依赖类成立的指标,比如,根据Student类能够创立出xiaomingxiaohongxiaojun等五个实例,各种实例表示三个实际的学员,他们全都属于Student类型。

概念:冬日属性的汇合,其性质能够涵盖基本值、对象大概函数。

1、封装:把相关的音讯(无论数额依然艺术)存款和储蓄在指标的力量
2、承继:由另四个类(或多少个类)得来的质量和办法的工夫
3、多态: 编写能以各类格局运转的函数或措施的技巧

1.1对象

于是,类和实例是比相当多面向对象编制程序语言的基本概念。

1.1对象

二.面向对象的帮助和益处

var person = new Object(); 
person.name = "zs"; 
person.age = 29; 

person.sayName = function(){ 
 alert(this.name); 
}; 
//用new object创建对象

只是,在JavaScript中,这几个定义供给改一改。JavaScript不区分类和实例的概念,而是经过原型(prototype)来落实面向对象编制程序。

var person = new Object(); 
person.name = "zs"; 
person.age = 29; 

person.sayName = function(){ 
 alert(this.name); 
}; 
//用new object创建对象

1、易维护
采用面向对象观念设计的结构,可读性高,由于一而再的留存,即使改动供给,那么维护也只是在一部分模块,所以爱惜起来是非凡平价和异常低本钱的。
js面向对象编制程序,js面向对象编制程序的有些笔记。2、质量高
在布置时,可选拔现成的,在原先的门类的世界中已被测量试验过的类使系统满意职业须求并有所较高的身分。
3、效率高
在软件开垦时,依据规划的内需对具体世界的东西举办抽象,发生类。使用这样的办法消除难题,临近于平常生活和自然的盘算情势,势必提升软件开采的频率和材料。
4、易扩展
出于延续、封装、多态的特色,自然设计出高内聚、低耦合的系统结构,使得系统更灵活、更易于增添,并且开支异常的低。

var person = {
name: "zs",
age: 29,

原型是指当我们想要创立xiaoming以此具体的上学的小孩子时,大家并未有二个Student花色可用。那如何做?恰好有如此贰个现存的指标:

var person = {
name: "zs",
age: 29,

三.js个中面向对象的写法

sayName: function(){
alert(this.name);
}
};

var robot = {
    name: 'Robot',
    height: 1.6,
    run: function () {
        console.log(this.name   ' is running...');
    }
};

sayName: function(){
alert(this.name);
}
};

1.厂子格局

//用对象字面量创设对象

 

//用对象字面量创造对象

 代码如下

1.2天性类型

咱俩看那些robot对象出名字,有身体高度,还有恐怕会跑,有一点像小明,干脆就依附它来“创立”小明得了!

1.2属性类型

复制代码

ECMAScript 中有几种天性:数据属性和访谈器属性。

于是大家把它改名叫Student,然后创立出xiaoming

ECMAScript 中有二种属性:数据属性和拜谒器属性。

function createPerson(name,age)
{
var person=new object();
person.name=name;
person.age=age;
person.showPerson=function()
{
alert(“我叫” this.name ”,我今年” this.age ”岁”);
}
}
var p1=createPerson(“huanghao”,23);
p1.showPerson();//我叫huanghao,我今年23岁

 数据类型:

<script>
var Student = {
  name: 'Robot',
  height: 1.7,
  run: function(){
    console.log(this.name   'is running...');
  }
};
var xiaoming = {
  name: '小明'
}

xiaoming.__proto__ = Student;//这里吧xiaoming的原型指向了对象Student,看上去xiaoming仿佛是从Student继承下来的:
console.log(xiaoming.name);
console.log(xiaoming.run());
</script>

 数据类型:

2.构造函数的法子

[[Configurable]]:表示是还是不是通过 delete 删除属性进而再度定义属性,那一个特点暗中同意值为 true。

 

[[Configurable]]:表示是不是通过 delete 删除属性进而再次定义属性,那个特点私下认可值为 true。

 代码如下

[[Enumerable]]:(可枚举)表示是还是不是通过 for-in 循环重回属性,那几个特点默许值为 true。

xiaoming有本身的name属性,但并未定义run()方法。可是,由于小明是从Student继承而来,只要Student有run()方法,xiaoming也得以调用:

[[Enumerable]]:(可枚举)表示是否通过 for-in 循环重返属性,这几个特点暗中认可值为 true。

复制代码

[[Writable]]:表示能无法修改属性的值,那几个特点暗许值为 true。

图片 1

[[Writable]]:表示是不是修改属性的值,那么些天性暗中认可值为 true。

function createPerson(name,age)
{
this.name=name;
this.age=age;
this.showPerson=function()
{
alert(“我叫” this.name ”,我今年” this.age ”岁”);
}
}
var p1=new createPerson(“huanghao”,23);
p1.showPerson();

[[Value]]:包涵那一个个性的数据值,这么些特性的暗中认可值为 undefined。

javascript的原型链和java的Class不同就在于它从不“Class”的定义,全体指标都以一实例,所谓承接关系可是是把一个目的的原型指向另贰个对象而已。

[[Value]]:包罗那一个脾气的数据值,那几个特点的暗中认可值为 undefined。

留意:前二种艺术有坏处,便是每一回new贰回,都会另行确立和睦的函数,假诺本身又新建二个var p2=new createPerson(“xiaotian”,20);接着大家弹一下alert(p1.showPerson===p2.showPerson),欣喜的意识结果为false,这也就代表这两回new出来的对象的showPerson方法不是同二个艺术,所以原型情势就涌出

访谈器类型:

就算您把xiaoming的原型指向任何对象:

访问器类型:

3.原型情势/构造与原型情势混合

[[Configurable]]:表示能还是不可能通过 delete 删除属性进而再度定义属性,那几个特点暗许值为 true。

<script>
var xiaoming = {
    name: '小明'
};

var Bird = {
  fly: function(){
        console.log(this.name   'is flying ...');
       }
};

xiaoming.__proto__ = Bird
console.log(xiaoming.fly());
</script>

[[Configurable]]:表示是或不是通过 delete 删除属性进而再一次定义属性,这一个特性暗中认可值为 true。

 代码如下

[[Enumerable]]:(可枚举)表示能还是不能够通过 for-in 循环重临属性,那几个个性暗许值为 true。

 

[[Enumerable]]:(可枚举)表示能还是不能够通过 for-in 循环重回属性,这几个特性默许值为 true。

复制代码

[[Get]]:在读取属性时调用的函数,私下认可值为 undefined。

近期xiaoming已经智尽能索run()了,他已经成为了一头鸟:

[[Get]]:在读取属性时调用的函数,暗中认可值为 undefined。

function createPerson(name,age)
{
this.name=name;
this.age=age;
}
createPerson.prototype.showPerson=function()
{
alert(“我叫” this.name ”,我今年” this.age ”岁”);
}
var p1=new createPerson(“huanghao”,23);
p1.showPerson();

[[Set]]:在写入属性时调用的函数,暗许值为 undefined。

xiaoming.fly(); // 小明 is flying...

[[Set]]:在写入属性时调用的函数,暗中认可值为 undefined。

同一是再次创下造几个var p2=new createPerson(“blue”,33);   alert(p1.showPerson===p2.showPerson)//true

1.2.1

 

1.2.1

地点这种办法属于原型与构造函数混合的艺术,也是我们在js面向对象时平常选拔的不二诀窍,这种艺术的写法是,将品质写在构造函数里,方法写在prototype里

要修改属性暗中同意的特色须要经过Object.defineProperty()方法,那个艺术接收四个参数:属性所在的靶子、属性的名字和三个陈说符对象。

在javascript代码有运营时代,你可以把xiaoming从Student编制程序Bird或许产生任何对象。

要修改属性暗许的特征必要通过Object.defineProperty()方法,那个法子接收三个参数:属性所在的指标、属性的名字和二个描述符对象。

四,js面向对象中的this指向难题

一遍定义五个特性能够利用Object.defineProperties()方法,第贰个目的是要拉长和改动其质量的目的,第一个对象的习性与第一个对象中要加上或修改的性情一一对应。

上述代码只是用来演示,在编写javascript代码时,不要直接选取obj.__proto__去退换二个指标的原型,况兼,低版本的IE也敬谢不敏运用__proto__。Object.create()方法能够流传多个原型对象,并创办一个基于该原型的新指标,可是新目的怎么样性质都不曾,由此,大家能够编写制定二个函数来成立xiaoming:

三回定义两本特性可以利用Object.defineProperties()方法,第一个目的是要增多和更换其品质的靶子,第贰个对象的性质与第一个指标中要丰富或修改的习性一一对应。

js面向对象平常会令人质疑的地点正是this指向难题,在小编的经验看来,平常状态下会有多少个地方在this指向难题出错,第贰个是运用放大计时器的时候,第二正是给指标加事件的时候,因而须求特别注意

1.2.2

<script>
//定义一个原型对象
var Student = {
  name: 'Robot',
  height: 1.3,
  run: function(){
    console.log(this.name   'is running.....');
  }
};

function createStudent(name){
  //基于Student原型创建一个新的对象
  var s = Object.create(Student);

  //初始化新对象
  s.name = name;
  return s;
}

var user = createStudent('jack');
console.log(user.name);
console.log(user.run());
console.log(user.__proto__ === Student);
</script>

1.2.2

总括:以上正是js忠的面向对象,运用第二种办法可以健全的模拟出主流编制程序语言的面向对象,而且在无尽面试个中都要问到的主题素材,

读取属性点天性:Object.getOwnPropertyDescriptor()方法,那一个点子接收多少个参数:属性所在的靶子和要读取其陈诉符的性质名称。

 

读取属性点天性:Object.getOwnPropertyDescriptor()方法,那些法子接收三个参数:属性所在的靶子和要读取其叙述符的习性名称。

...

2.成立对象

结果:

2.创设对象

编辑:www.mg4377.com 本文来源:js面向对象编制程序,js面向对象编制程序的有些

关键词: Web前端 JavaScript Html/Css