1、发展史

  面向机器

  面向过程:将程序的执行分解成若干个步骤

  面向对象:将程序的执行分解成若干个事物

2、面向对象两个基本概念

类:代表某类事物,是抽象的

对象:代表某个事物,是具体的

3、快速入门

表达一个人的完整信息

 1 <script>
2
3 //面向过程
4 var name = 'zhangsan';
5 var age = 30;
6 var marry = true;
7 alert(name + age + marry);
8
9 //面向对象
10 function Person{
11 }
12 var p1 = new Person();
13 p1.name = 'lisi';
14 p1.age = 20;
15 p1.marry = true;
16 alert(p1.name + p1.age + p1.marry);
17
18 </script>

在面向过程的例子中,我们分别使用了三个变量来定义一个人的完整信息,但这三个变量它们之间没有必然的联系,如:我现在找到变量age,虽然可以取到数据,但并不清楚这是“谁”的年龄。

在面向对象的例子中, function Person{}是构造器。我们可以这样理解,每一个定义的function Person{}都是Person类的构造函数。

4.JS中常见的系统类

1)String类 字符串类

length :取得字符串长度

indexOf(string) :取得参数在字符串中出现的位置

substr(num1,[num2]) :截取字符串

toLowerCase()       :转换为小写

toUpperCase() :转换为大写

replace(str1,str2) :字符串替换

2)Date类   日期类

getYear()        :返回年份(有时会出错,建议用第二种)

getFullYear()  :返回年份

getMonth()     :返回月份 (0---11)

getDate()       :返回每月第几天

getDay()         :返回星期数 (0-6)

getHours()      :返回小时数

getMinutes()   :返回分钟数

getSeconds() :返回秒数

getMilliseconds() :返回毫秒数

3)Math类  数学类

ceil(数值)       :返回大于或等于该数的最小整数(比如说分页 Math.ceil(4.8)=5)

floor(数值)     :返回小于或等于该数的最大整数

min(数值1,数值2) :返回最小数

max(数值1,数值2) :返回最大数

pow(数值1,数值2) :返回数值1的数值2次方

random()              :返回随机数  0----------1

round(数值)   :四舍五入

sqrt(数值)      :开平方根

Math类下的方法都是静态方法

5.自定义类--类的定义

语法:

function 类名(){

}

在js中,没有类的定义语句,只有function,每一个function,我们可以认为它是同名类的构造函数

比如说:

function person(){

}

它是Person类的构造函数

这种函数也叫构造器

6.自定义类--声明对象

语法: var 对象=new 类名();

关键字new:实例化对象, 开辟相应内存空间

1 function Person(){
2 alert('hello');
3 }
4 var p1 = new Person();

执行上面这个例子时,我们发现,在实例化时,直接执行了Person构造函数

7.自定义类--关于对象属性的使用

语法:

  对象.属性;

  对象['属性'];

1 function Person(){
2 alert('hello');
3 }
4 var p1 = new Person();
5 p1.name='zhangsan';
6 p1.age=30;
7 alert(p1.name+p1.age);

在js中,对象属性是动态添加的,对象属性可以使用“.”或['']这两种形式表示出来

对象的属性可以是任何数据类型,如:字符串、数字、对象

8.三个关键字

constructor: 返回的是对象的构造器

typeof :返回数据类型

instanceof :判断对象是否是某个类的实例

 1 function Person(){
2 alert('hello');
3 }
4 var p1 = new Person();
5 p1.name='zhangsan';
6 p1.age=30;
7 alert(p1.name+p1.age);
8
9 //返回p1对象的构造器
10 alert(p1.constructor);
11 //取得p1变量的数据类型
12 alert(typeof p1);
13 //判断p1是不是Person类的一个实例
14 alert(p1 instanceof Person);

9.对象在内存中的表现形式

1 //例1
2 function Person(){
3 }
4 var p1 = new Person();
5 p1.name='zhangsan';
6 p1.age=30;
7
8 var p2 = new Person();
9 alert(p2.name);

在例1中,创建p1对象时,会为p1开辟相应的堆空间,然后将name和age属性以及值添加到p1所指向的堆空间中,创建p2对象时,也会为p2对象开辟对应的空间,但p2所指向的堆空间是空的,所以P2对象没有name和age属性。

 1 //例2
2 function Person(){
3 }
4 var p1 = new Person();
5 p1.name = 'zhangsan';
6 p1.age = 30;
7
8 var p2 = p1;
9 alert(p2.name);
10 p2.name = 'lisi';
11 alert(p2.name);
12 alert(p1.name);

在例2中,将p1栈中保存的堆的地址赋值给了p2,所以说,p2也指向了p1指向的堆内存的地址。两个对象指向了同一块堆内存,所以改变一个对象的属性,会影响到另一个对象。

 1 //例3
2 function Person(){
3 }
4 var p1 = new Person();
5 p1.name = 'zhangsan';
6 p1.age = 30;
7
8 var p2 = p1;
9 alert(p2.name);
10 p2 = null;
11 alert(p1.name);
12 alert(p2.name);

在例3中,P2=null; 表示释放p2所占的栈空间,但p1的空间仍保留,p1仍然指向相应的堆空间,所以删除p2不会影响到p1对象。

 
 
 

js面向对象2的更多相关文章

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

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

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

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

  3. JS面向对象(3) -- Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法

    相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...

  4. JS面向对象(2) -- this的使用,对象之间的赋值,for...in语句,delete使用,成员方法,json对象的使用,prototype的使用,原型继承与原型链

    相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...

  5. JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式

    相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...

  6. js面向对象的实现(example 二)

    //这个方法和上篇文章(js面向对象的实现(example 一))中的方法类似,但是更为简洁 //通过函数赋值的方式来构造对象 //同样通过闭包的方式来封装对象及内部变量 (function () { ...

  7. 浅谈JS面向对象之创建对象

    hello,everybody,今天要探讨的问题是JS面向对象,其实面向对象呢呢,一般是在大型项目上会采用,不过了解它对我们理解JS语言有很大的意义. 首先什么是面向对象编程(oop),就是用对象的思 ...

  8. js面向对象,有利于复用

    需求:在网页上添加个天气预报. 以前总是在需要执行js的地方,直接写function(){}.在需要同样功能的地方直接copy,或者稍微修改. 然后在网上看看有没有好点的方法,然后就看到js面向对象编 ...

  9. JavaScript基础精华02(函数声明,arguments对象,匿名函数,JS面向对象基础)

    函数声明 JavaScript中声明函数的方式:(无需声明返回值类型) function add(i1, i2) {             return i1 + i2;//如果不写return返回 ...

  10. 原生JS面向对象思想封装轮播图组件

    原生JS面向对象思想封装轮播图组件 在前端页面开发过程中,页面中的轮播图特效很常见,因此我就想封装一个自己的原生JS的轮播图组件.有了这个需求就开始着手准备了,代码当然是以简洁为目标,轮播图的各个功能 ...

随机推荐

  1. 【Guava】RateLimiter类

    Guava官方文档-RateLimiter类 原文链接 作者:Dimitris Andreou  译者:魏嘉鹏 校对:方腾飞 RateLimiter 从概念上来讲,速率限制器会在可配置的速率下分配许可 ...

  2. GN算法---《Community structure in social and biological networks》这篇论文讲了什么?

    用中文记下这篇论文的大致意思,以防止忘了.好记性不如烂笔头! 摘要:最近的一些研究在研究社交网络或WWW.研究者都集中于研究网络的“小世界性”,“幂率分布特性”,“网络传递性”(聚类性吧).本文提出网 ...

  3. 关于Execel 2007 连接到 hive odbc

    官方给出的都是 2010 或2012版的连接方案,看起来与2007有些不同,但我相信这些功能都是通用的. 下载 odbc hive 驱动.http://hortonworks.com/products ...

  4. requirejs重点

    1.shim:用于配置不是通过define函数包装的文件,导出什么东西,如果这个文件不再baseURL目录下的话,需要在paths中配置文件目录.并且paths中的键名.shim中的键名.requir ...

  5. flask总结01

    一:Flask的基本介绍和小案例 01:flask的基本介绍 Flask诞生于2010年,是Armin ronacher(人名)用 Python 语言基于 Werkzeug 工具箱编写的轻量级Web开 ...

  6. cmd命令窗口相关操作指南

    cmd命令窗口打开方式:win+R cmd 1.盘符切换 d: 回车 (d为磁盘名) 2.查看当前目录下的文件和文件夹 输入dir 3.进入指定目录(若需跨盘符操作,应先切换盘符) cd(空格)+绝对 ...

  7. Android 基于TCP多线程通信实现群聊天的功能

    1.TCP多线程原理图 2.实现方法 (1)服务器端 (2)客户端 3.java后台代码 主界面 package com.lucky.test50socket2; import android.ann ...

  8. svn 命令

    svn基本的操作流程就是: 你刚刚进入一个新的公司,让你接手一个正在进行的项目,你打开终端写下了:svn co svn://192.168.1.1/pro/domain 然后就可以在当前目录里面找到一 ...

  9. vue数据双向绑定的原理、虚拟dom的原理

    vue数据双向绑定的原理https://www.cnblogs.com/libin-1/p/6893712.html 虚拟dom的原理https://blog.csdn.net/u010692018/ ...

  10. Kibana6.x.x源码分析--如何自定义savedObjectType对象

    上篇说到了如何使用kibana自带的savedObjectType对象,现在我们来自定义一个自己的savedObjectType. 下面的截图是我自己模仿写的保存对象,以及如何在kibana插件中注册 ...