1.创建对象的三种方式:

l第一种构造法:new  Object

var a = new Object();

a.x = 1, a.y = 2;

l第二种构造法:对象直接量

var b = { x : 1, y : 2 };

l第三种构造法:定义类型

function Point(x, y){

this.x = x;

this.y = y;

}

var p = new Point(1,2);

2.访问对象

l访问对象的属性
l中括号表示法:hero['name']。、
l点号表示法:hero.name。
l如果访问的属性不存在,会返回undefined。
l访问对象的方法
l方法名后加一对括号:hero.say()。
l像访问属性一个访问方法:hero['say']()。

3.删除属性与方法

//创建一个空对象

var hero = {};

//为hero对象增加属性和方法

hero.name = "javascript";

hero.value = "helloworld";

hero.sayName = function(){return "hello " + hero.name;};

//测试

alert(hero.name);  //output  javascript

alert(hero.sayName());  //output  hello javascript

//删除hero对象的name属性

delete hero.name;

//测试

alert(hero.sayName());  //output  hello undefined

4.使用this值

//创建一个空对象

var hero = {};

//为hero对象增加属性和方法

hero.name = "javascript";

hero.value = "helloworld";

hero.sayName = function(){return "hello " + this.name;};

//测试

alert(hero.name);  //output  javascript

alert(hero.sayName());  //output  hello javascript

总结:

l这里的this实际上引用的是“这个对象”或“当前对象”。
lthis的用法,大部分人的使用问题都比较多。所以不建议过多使用!

5.内建对象

 

l内建对象大致上可以分为三个组:

l数据封装类对象 —— 包括Object、Array、Boolean、Number和String。这些对象代表着javascript中不同的数据类型,并且都拥有各自不同的typeof返回值,以及undefined和null状态。
l工具类对象 —— 包括Math、Date、RegExp等用于提供遍历的对象。
l错误类对象 —— 包括一般性错误对象以及其他各种更特殊的错误类对象。它们可以在某些异常发生时帮助我们纠正程序工作状态。

6.Object对象

lObject是javascript中所有对象的父级对象,这意味着所有对象都继承于Object对象。
l创建一个空对象:

var object = {};

var obj = new Object();

7.Array对象

lArray对象用于在单个的变量中存储多个值。
l创建一个空Array对象:

var object = {};

var obj = new Array();

例如1://反转字符串示例

//定义一个字符串

var str = "a,b,c,d,e,f,g";

//利用String对象的split()方法,将字符串切割成一个数组

var arr = str.split(",");

//利用Array对象的reverse()方法,将数组中元素的顺序颠倒。

arr = arr.reverse();

//测试打印

alert(arr.toString());

8.String对象

lString对象与基本的字符串类型之间的区别:

var str = "hello";

var obj = new String("world");

alert(typeof str);  //typeof  string

alert(typeof obj);  //typeof  object

例如1://判断字符串是否包含指定字符串示例

//定义两个要判断的字符串

var str = "abcdefg";

var substr = "efg";

/*

* 定义判断字符串是否包含指定字符串的函数

*   * 第一个参数:要判断的字符串

*   * 第二个参数:指定的字符串

*/

function sub(str,substr){

//将判断的字符串定义成String对象

var string = new String(str);

//截取判断的字符串

var result = string.substr(string.indexOf(substr),substr.length);

/*

* 判断截取后的字符串是否为空

*   * 为空,说明不包含指定字符串

*   * 不为空,说明包含指定字符串

*/

if(result==substr){

return true;

}else{

return false;

}

}

alert(sub(str,substr));

9.原型(prototype)

l函数本身也是一个包含了方法和属性的对象。而现在我们要研究的就是函数对象的另一个属性 —— prototype。

l利用原型添加方法与属性
l利用自身属性重写原型属性
l扩展内建对象

l利用原型添加方法与属性

l下面创建一个新的函数对象,并设置一些属性和方法:

function Hero(name, color){

this.name = name;

this.color = color;

this.whatareyou = function(){

return "I am a " + this.color + " " + this.name;

}

}

var hero = new Hero("javascript","red");

alert(hero.whatareyou());  //output  I am a red javascript

l为上面的Hero函数对象增加一些属性和方法:

Hero;

Hero;

Hero.prototype.getInfo = function(){

return "Rating: " + this.rating + " , Price: " + this.price;

}

alert(hero.getInfo());  //output  Rating: 3 , Price: 100

l上面的方式,也可以这样去做:

Hero.prototype = {

price ,

rating ,

getInfo : function(){

return "Rating: " + this.rating + " , Price: " + this.price;

}

};

l利用自身属性重写原型属性
l如果对象的自身属性与原型属性同名该怎么办呢?答案是对象自身属性的优先级高于原型属性

function Hero(){

this.name = "jscript";

}

Hero.prototype.name = "javascript";

var hero = new Hero();

alert(hero.name);  //output  jscript

delete hero.name;

alert(hero.name);  //output  javascript

l扩展内建对象

//为原型 Array对象增加一个判断的函数

Array.prototype.inArray = function(color){

, len = this.length; i < len; i++){

if(this[i] === color){

return true;

}

}

return false;

}

//定义一个Array对象

var a = ["red", "green", "blue"];

//测试

alert(a.inArray("red"));  //true

alert(a.inArray("yellow"));  //false

10.继承

l如果两个类都是同一个实例的类型,那么它们之间存在着某些关系,我们把同一个实例的类型之间的泛化关系称为“继承”。
l继承关系至少包含三层含义:
l子类的实例可以共享父类的方法。
l子类可以覆盖父类的方法或扩展新的方法。
l子类和父类都是子类实例的“类型”。
l在javascript中,并不支持“继承”。也就是说,javascript中没有继承的语法。从这个意义上来说,javascript并不是直接的面向对象语言。

11.原型链

    l原型链是ECMAScript标准制定的默认继承方式。
    例如:

function A(){

this.name = "a";

this.toString = function(){return this.name};

}

function B(){

this.name = "b";

}

function C(){

this.name = "c";

;

this.getAge = function(){return this.age};

}

B.prototype = new A();

C.prototype = new B();

 解释说明:

l将对象直接创建在B对象的prototype属性中,并没有去扩展这些对象的原有原型。
l通过new A ( ) 另创建了一个新的实体,然后用它去覆盖该对象的原型。
ljavascript是一种完全依靠对象的语言,其中没有类(class)的概念。
l因此,需要直接用new A ( ) 创建一个实体,然后才能通过该实体的属性完成相关的继承工作。
l完成这样的继承实现之后,对 A ( ) 所进行的任何修改、重写或删除,都不会对 B ( ) 产生影响。

只继承于原型:

 

function A(){}

A.prototype.name = "a";

A.prototype.toString = function(){return this.name};

function B(){}

B.prototype = A.prototype;

B.prototype.name = "b";

function C(){}

C.prototype = B.prototype;

C.prototype.name = "c";

C;

C.prototype.getAge = function(){return this.age};

l 对象之间的继承(扩展内容,可以不会)(浅复制)

//该函数接受一个对象并返回它的副本

function extendCopy(p){

var z = {};  //定义一个空的对象z

for(var i in p){  //var i =0 ; i < p.length ; i++

z[i] = p[i];  //都当做数组处理的话,可以理解

}

//uber属性:将p作为z的父级,将z指向p的原型

z.uber = p;

return z;

}

//定义对象a,但是对象a不是函数对象

var a = {

name : "a",

toStr : function(){return this.name;}

}

//定义对象b,但是对象b不是函数对象

var b = extendCopy(a);

b.name = "b";

b.toStr = function(){return this.uber.toStr() + " , " + this.name;};

//定义对象c,但是对象c不是函数对象

var c = extendCopy(b);

c;

alert(c.toStr());  //output  a , b , 18

4.高级js--(面向对象js)_2的更多相关文章

  1. Vue ---- vue的基本使用 文本/事件/属性指令 补充: js面向对象 js函数

    目录 日考题(知识点)

  2. 5月17日上课笔记-js面向对象

    二.js面向对象 js创建对象: var 对象名称 = new Object(); person.name = "小明"; //姓名 person.age = 18; person ...

  3. 第十五节 JS面向对象实例及高级

    实例:面向对象的选项卡 把面向过程的程序,改写成面向对象的形式 原则:不能有函数套函数,但可以有全局变量 过程: onload —— 改写成 构造函数,其中window.onload的功能是在页面加载 ...

  4. 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十五 ║Vue基础:JS面向对象&字面量& this字

    缘起 书接上文<从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十四 ║ VUE 计划书 & 我的前后端开发简史>,昨天咱们说到了以我的经历说明的web开发经历的 ...

  5. JS面向对象(2)——原型链

    原型链用于ECMAScript的继承.其思想是利用原型让一个引用类型继承另一个引用类型的属性和方法.说人话,我们知道,一个构造函数Subtype,其原型对象有一个指向构造函数的指针,这是联系构造函数和 ...

  6. JS面向对象(1)——构造函数模式和原型模式

    1.构造函数模式 构造函数用来创建特定的类型的对象.如下所示: function Person(name,age,job){ this.name=name; this.job=job; this.ag ...

  7. ES6学习笔记(三):教你用js面向对象思维来实现 tab栏增删改查功能

    前两篇文章主要介绍了类和对象.类的继承,如果想了解更多理论请查阅<ES6学习笔记(一):轻松搞懂面向对象编程.类和对象>.<ES6学习笔记(二):教你玩转类的继承和类的对象>, ...

  8. js 面向对象 动态添加标签

    有点逻辑 上代码 thml布局 点击查看代码 <!DOCTYPE html> <html lang="en"> <head> <meta ...

  9. js面向对象学习 - 对象概念及创建对象

    原文地址:js面向对象学习笔记 一.对象概念 对象是什么?对象是“无序属性的集合,其属性可以包括基本值,对象或者函数”.也就是一组名值对的无序集合. 对象的特性(不可直接访问),也就是属性包含两种,数 ...

  10. 带你一分钟理解闭包--js面向对象编程

    上一篇<简单粗暴地理解js原型链--js面向对象编程>没想到能攒到这么多赞,实属意外.分享是个好事情,尤其是分享自己的学习感悟.所以网上关于原型链.闭包.作用域等文章多如牛毛,很多文章写得 ...

随机推荐

  1. jQuery控制元素显示、隐藏、切换、滑动的方法

    jQuery 隐藏和显示 通过 hide() 和 show() 两个函数,jQuery 支持对 HTML 元素的隐藏和显示: 实例 $("#hide").click(functio ...

  2. 找不到 EntityType “ ” 的映射和元数据信息。

    意思是: 数据库里边有添加的新字段DB1,而程序中的的实体即“元数据”中没有这个新字段Et1,由于EntityFramework更新模型时已自动默认对DB1和Et1进行了映射(默认认为实体中存在这个字 ...

  3. [原创] 抛弃vboot不格盘用Grub4dos+Winvblock或Firadisk安装Ghost版XP到VHD,轻松RAMOS!

    [原创] 抛弃vboot不格盘用Grub4dos+Winvblock或Firadisk安装Ghost版XP到VHDhttp://bbs.wuyou.net/forum.php?mod=viewthre ...

  4. 阿里云安装kubernetes-UI报错endpoints \"kubernetes-dashboard\" not found解决方法

    问题:阿里云ECS安装kube-ui v5后,访问 http://master_ip:8080/ui/跳转到http://master_ip:8080/api/v1/proxy/namespaces/ ...

  5. 以zookeeper为注册中心搭建spring cloud环境

    在spring cloud体系中,有多种手段实现注册中心,本例中采用zookeeper作为注册中心的角色.服务提供者向zookeeper注册,服务消费者从zookeeper中发现服务提供者的相关信息, ...

  6. python 数组或列表维度增加

    怎么把[,,,,]变成[[],[],[],[],[]]???

  7. Eureka与ZooKeeper 的比较(转)

    https://www.cnblogs.com/zgghb/p/6515062.html Eureka的优势 1.在Eureka平台中,如果某台服务器宕机,Eureka不会有类似于ZooKeeper的 ...

  8. linux删除文件夹下除了某一个文件之外的所有文件及find用法

    原文: https://www.jb51.net/article/99319.htm 比如一个目录下有1,2,3,4,5这五个文件,现在我需要删除除了2以外的所有文件,那么我可以使用 find . ! ...

  9. GCViewer / MAT

    jvm出现问题时,我们可以开启jmx功能,使用jvisualvm或者jconsole等监控其他机器上的jvm的运行情况,如https://www.cnblogs.com/princessd8251/p ...

  10. T-SQL 类型转换

    use StudentManageDB go --定义变量并查询 declare @sumScore int select @sumScore=(CSharp+SQLServerDB) from Sc ...