初识JavaScript和面向对象
1.javascript基本数据类型:
number: 数值类型
string: 字符串类型
boolean: 布尔类型
null: 空类型
undefault:未定义类型
object: 基本数据类型的父类
2.创建对象
(1)自定义对象:
语法:var 对象名=new object();
例: var flower=new Object();
flower.name="长春花";
flower.showName=function(){
// this.name="牡丹花";//重新赋值
alert(this.name);
}
var flower1=new flower();
调用方式:对象名.属性或者方法
(2)内置对象:
String(字符串)对象
Date(日期)对象
Array(数组)对象
Boolean(逻辑)对象
Math(算数)对象
RegExp对象
3.构造函数:
构造函数的步骤:
(1)创建一个新对象
(2)将构造函数的作用域给新对象(this就指向这个新对象)
(3)执行构造函数中的代码
(4)返回新对象
语法:function 函数名(){} 注:函数名首字母大写
例:function Flower(){
}
constructor属性:
instanceof属性:
两种方式均是标识对象类型的(判断关键字前后是否具有上下级关系(层次)),但常用第二种方法
例:
// alert(flower2.constructor==Flower);
// alert(flower1.constructor==flower2.constructor);
alert(flower1 instanceof Object);//判断关键字前后是否具有上下级关系(层次)
alert(flower1 instanceof Flower);
4.原型对象:
使用prototype属性调用构造函数而创建的那个对象实例的原型对象,
使用原型对象的好处就是可以让所有对象实例共享它所拥有的属性和方法
语法:函数名.prototype.属性名="值";
例:function Flower(){}//创建一个无参的构造函数
Flower.prototype.name="长春花";//给Flower原型对象创建属性并赋值
Flower.prototype.area="非洲";
5.原型链:
例:
//创建一个父类
function Humans(){//创建一个无参的构造
this.foot=2;
}
Humans.prototype.getFoot=function(){
alert(this.foot);
}
//创建子类
function Man(){
this.head=1;
}
Man.prototype =new Humans();//原型继承一定要写在原型对象赋值之前
Man.prototype.getHead=function(){
alert(this.head);
}
var man1=new Man();
alert(man1.getFoot());
man1.getHead();
//alert(man1 instanceof Humans);
// alert(man1 instanceof Man);
alert( typeof man1);
alert(man1.valueOf());
6.对象继承:
function Humans(){//创建一个无参的构造
this.name=["aa","bb","cc"];
}
//创建子类
function Man(){
this.head=1;
}
Man.prototype =new Humans();
var man1=new Man();
man1.name.push("dd");//如果你赋值的是引用数据类型,相当于改原构造中的值
man1.getName();
var man2=new Man();
man2.getName();
7.借用构造函数:
语法:apply([thisObj[,argArray]]) 应用某一对象的一个方法,用另一个对象替换当前对象
call([thisObj[,arg1[,arg2[,argn[,...]]]]]) 调用一个对象一个方法,以另外一个对象替换当前对象
例: function Humans(){
alert("无参构造");
this.clothing=["哈哈","嘻嘻","呵呵"];
}
function Humans(name){
alert("有参构造");
this.name=name;
}
function Man(){
//Humans.call(this);//继承了Humans对象无参构造
Humans.call(this,"嘿嘿");//调用有参构造
this.age=19;
}
var man1=new Man();
alert(man1.clothing);//undefind
alert(man1.name);//嘿嘿
alert(man1.age);//19
8:组合函数:
组合继承有时也叫伪经典继承,指的是将原型链和借用狗杂函数的技术结合到一块,从而发挥二者之长
例: function Humans(name,age){//创建有参构造
this.name=name;
this.age=age;
}
Humans.prototype.getName= function () {//创建Humans原型对象的方法
alert(this.name);
}
function Man(name,age){//创建Man有参构造
Humans.call(this,name,age);//继承父类的构造
/* 等价于this.name=name;
this.age=age;*/
this.head=1;
}
Man.prototype=new Humans();//继承父类的原型对象的属性
Man.prototype.getHead=function(){
alert(this.head);
}
var man1=new Man("aa",20);
man1.getName();
//alert(man1.name);
//alert(man1.age);
var man2=new Man("bb",25);
man2.getName();
// alert(man2.name);
// alert(man2.age);
// Man.prototype=new Humans();
初识JavaScript和面向对象的更多相关文章
- JavaScript的面向对象编程(OOP)(一)——类
在学习JavaScript面向对象的编程之前,需要知道,并了解面向对象的一些基本的常识.初学者中大多数都以为面向对象中,面向对象的编程是很重要和占据很大一部分精力.笔者在之前也是认为OOP是面向对象的 ...
- javascript进阶——面向对象特性
面向对象的javascript是这门语言被设计出来时就考虑的问题,熟悉OOP编程的概念后,学习不同的语言都会发现不同语言的实现是不同的,javascript的面向对象特性与其他具有面向对象特性的语言的 ...
- 笔记一、初识 Javascript
一.初识 Javascript javascript是一种专为与网页交互儿设计的脚本语言.由三部分组成:ECMAScript (ECMA-262定义) : 提供核心语言功能文档对象模型(DOM): ...
- Day15 HTML补充、初识JavaScript
一.上节回顾 上节回顾: HTML 头部信息:编码.title.style.link(导入css文件) 身体: 内联 块级 --->inline-block(既有内联效果又有块级效果) a标签: ...
- javascript的面向对象详解
每次说到javascript到面向对象,总感觉自己心里懂,但是却不知道该怎么说,这就是似懂非懂到表现,于是乎,每次一说,就要到处去查找资料,零零碎碎到看了一些,感觉有懂了,但是过段时间,好像又不知道是 ...
- 初识JavaScript(一)
初识JavaScript(一) 最近由于工作的需要的原因,我从一个写后台的现在让我转到写前端,再加上我的js部分特别的差,所以我现在开始学习js部分的知识. 我的第一篇博文就这样开始写了.俗话说,千里 ...
- 浅谈JavaScript的面向对象程序设计(四)
本文继续讲解JavaScript的面向对象程序设计.继承是面向对象语言中的一个基本概念,面向对象语言支持两种继承实现方式:接口继承和实现继承.接口继承只继承方法签名,而实现继承则继承实际的方法.但是在 ...
- 《前端之路》之 初识 JavaScript
01 初识 JavaScript 作为在码农圈混迹了 四五年的老码畜来说,学习一门新的语言,就仿佛是老司机开新车一样 轻车熟路. 为什么会这么快呢? 因为各种套路啊- 任何一种计算机语言的最开始都是和 ...
- JavaScript的面向对象原理之原型链详解
一.引言 在16年的10月份,在校内双选会找前端实习的时候,hr问了一个问题:JavaScript的面向对象理解吗?我张口就说“JavaScript是基于原型的!”.然后就没什么好说的了,hr可能不知 ...
随机推荐
- java中session和application的用法
Session的用法 首先创建2个jsp文件t1.jsp t2.jsp 在t1.jsp <% //设置session的键与值 session.setAttribute("abc&qu ...
- MyBatis 核心配置综述之Executor
目录 MyBatis四大组件之 Executor执行器 Executor的继承结构 Executor创建过程以及源码分析 Executor接口的主要方法 Executor 的现实抽象 上一篇我们对Sq ...
- django执行mysql恢复的时候出现“The request's session was deleted before the request completed. The user may have logged out in a concurrent request, for example.”
版本: django:2.1.7 python:3.7 mysql:5.7.25 今天在用django做mysql备份和恢复的时候,备份没问题,恢复时出现如下错误提示: The request's s ...
- leetcode 136 Single Number bBt Option
Linked Url:https://leetcode.com/problems/single-number/ Given a non-empty array of integers, every e ...
- c++学习书籍推荐《C++编程思想第一卷》下载
百度云及其他网盘下载地址:点我 编辑推荐 <C++编程思想>(第1卷)(第2版)第1版荣获"软件开发"杂志评选的1996年度 图书震撼大奖,中文版自2000年推出以来, ...
- 产品经理人的持续交付和DevOps实践
如果你正处于下列情形中 ,那这篇文章是为你准备的: 你目前身处技术行业,你是产品经理,并且,你明白特性分支是什么,CD代表什么,DevOps文化是什么样子的. 或者,你已经在实施敏捷,团队每周都会与您 ...
- CDQZ集训DAY1 日记
爆炸的一天…… 上午考试,然而一道题都没想出正解. T1刚看到题就想到数位DP,然后有感觉是反演,然后读完题之后又觉得是数位DP,发现最后只关注最后9位打了一个类似数位DP的爆搜.期望20分,实际10 ...
- Day1 -Python program
采用python 3.5 用PyCharm编译 第一串代码 print ("hello,world!") 练习1 输入一个用户名和密码,如果输入正确,就欢迎登陆,否则就显示错误. ...
- 洛谷 P2671 求和
题目描述 一条狭长的纸带被均匀划分出了nn个格子,格子编号从11到nn.每个格子上都染了一种颜色color\_icolor_i用[1,m][1,m]当中的一个整数表示),并且写了一个数字number\ ...
- [蓝桥杯] Fibonacci数列 入门
原题链接 import java.util.Scanner;//导入Scanner类 public class Main { public static void main(String[] args ...