针对基础知识的每一个小点,我都写了一些小例子,https://github.com/huyanluanyu1989/DesignPatterns.git,便于大家理解,如有疑问,大家可留言给我,最近工作比较忙,可能更新会比较慢,大家多我原谅,有兴趣可以关注一下,后续我会尽快更新的,谢谢大家支持!!!

第一部分 基础知识

第1章 面向对象的JavaScript

1.1 动态类型语言和鸭子类型

  编程语言按照数据类型大体可以分为两类,一类是静态类型语言,另一类是动态类型语言。

  静态类型语言在编译时便已确定变量的类型,而动态类型语言的变量类型要到程序运行的时候,待变量被赋予某个值之后,才会具有某种类型。

   鸭子类型(duck typing)的通俗说法是:“如果它走起路来像鸭子,叫起来也是鸭子,那么它就是鸭子。

  

<script type="text/javascript">
var duck = {
duckSinging : function(){
console.log('嘎嘎嘎');
}
}
var chicken = {
duckSinging : function(){
console.log('嘎嘎嘎');
}
} var choir = [];
var joinchoir = function(animal){
if(animal && typeof(animal.duckSinging) === 'function'){
choir.push(animal);
console.log('恭喜加入合唱团');
console.log(choir.length);
}
}
joinchoir(duck);
joinchoir(chicken);
</script>

1.2 多态

  多态的实际含义是:同一操作作用于不同的对象上面,可以产生不同的解释和不同的执行结果。换句话说,给不同的对象发送同一个消息的时候,这些对象会根据这个消息分别给出不同的反馈。

  多态背后的思想是将“做什么”和“谁去做以及怎样去做”分离开来,也就是将“不变的事物”与 “可能改变的事物”分离开来。把不变的部分隔离出来,把可变的部分封装起来。

  

<script type="text/javascript">
var makeSound = function (animal){
if(animal instanceof duck){
console.log("嘎嘎嘎");
}else if(animal instanceof chicken){
console.log("咯咯咯");
}
}
var duck = function(){};
var chicken = function(){};
makeSound(new duck);
makeSound(new chicken);
</script>

1.3 封装

  封装的目的是将信息隐藏。

  封装数据:JavaScript只能依赖变量的作用域来实现封装特性,而且只能模拟出 public 和 private 这两种封装性。

  封装类型:是通过抽象类和接口来进行的。

  封装变化:通过封装变化的方式,把系统中稳定不变的部分和容易变化的部分隔离开来,在系统的演变过程中,我们只需要替换那些容易变化的部分。

  

<script type="text/javascript">
var goolgeMap = {
show:function(){
console.log("谷歌地图")
}
}
var baiduMap = {
show:function(){
console.log("百度地图");
}
}
var renderMap = function(map){
if(map.show instanceof Function){
map.show();
}
}
renderMap(goolgeMap);
renderMap(baiduMap);
</script>

1.4 原型模式和基于原型继承的 JavaScript 对象系统

 原型编程范型至少包括以下基本规则:

 1. 所有的数据都是对象。

  JavaScript在设计的时候,模仿 Java 引入了两套类型机制:基本类型和对象类型。基本类型:undefined、number、boolean、string、function、object。除了 undefined 之外,一切都应是对象。

  JavaScript 中的根对象是 Object.prototype 对象。Object.prototype 对象就是它们的原型。

  

<script type="text/javascript">
var Plane = function(){
this.blood = 100;
this.attackLevel = 1;
this.defenseLevel = 1;
}
var plane = new Plane();
plane.blood=500;
plane.attackLevel=10;
plane.defenseLevel=7; var clonePlane = Object.create(plane);
console.log(clonePlane)
</script>

 2.要得到一个对象,不是通过实例化类,而是找到一个对象作为原型并克隆它。

<script type="text/javascript">
function Person(name){
this.name = name;
}
Person.prototype.getName = function(){
return this.name;
} var objectFactory = function(){
var obj = new Object(); // 从 Object.prototype 上克隆一个空的对象
Construtor = [].shift.call(arguments);// 取得外部传入的构造器,此例是 Person
obj.__proto__ = Construtor.prototype;// 指向正确的原型
var ret = Construtor.apply(obj, arguments);// 借用外部传入的构造器给 obj 设置属性
return typeof ret === 'object' ? ret : obj ;// 确保构造器总是会返回一个对象
} var a = objectFactory(Person, 'sven');
// var a = new Person('Remen')
console.log(a.name);
console.log(a.getName());
console.log(Object.getPrototypeOf(a) === Person.prototype);
</script>

 3.对象会记住它的原型。

  对象把请求委托给它的构造器的原型。  

 4. 如果对象无法响应某个请求,它会把这个请求委托给它自己的原型。

  在 JavaScript 中,每个对象都是从 Object.prototype 对象克隆而来的,只能得到单一的继承关系,即每个对象都继承自 Object.prototype 对象,

 在原型继承方面 ,JavaScript也同样遵守这些原型编程的基本规则。

<script>
//一个类继承自另一个类时
var A = function(){};
A.prototype = {name : 'sven'}; var B = function(){};
B.prototype = new A(); var b = new B();
var a = new A();
console.log(b.name) </script>

  

第1章 面向对象的JavaScript的更多相关文章

  1. javascript高级程序设计第3版——第6章 面向对象的程序设计

    第六章——面向对象的程序设计 这一章主要讲述了:面向对象的语言由于没有类/接口情况下工作的几种模式以及面向对象语言的继承: 模式:工厂模式,构造函数模式,原型模式 继承:原型式继承,寄生式继承,以及寄 ...

  2. 前端开发:面向对象与javascript中的面向对象实现(一)

    前端开发:面向对象与javascript中的面向对象实现(一) 前言: 人生在世,这找不到对象是万万不行的.咱们生活中,找不到对象要挨骂,代码里也一样.朋友问我说:“嘿,在干嘛呢......”,我:“ ...

  3. 第十一章 前端开发-JavaScript

    第十一章 前端开发-JavaScript 11.3.1 js引入方式 行内样式 <p id="" class="" style="" ...

  4. 前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型

    前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型 前言(题外话): 有人说拖延症是一个绝症,哎呀治不好了.先不说这是一个每个人都多多少少会有的,也不管它究竟对生活有多么大的 ...

  5. 面向对象的 JavaScript

    面向对象的javascript 一.创建对象 创建对象的几种方式: var obj = {}; var obj = new Object(); var obj = Object.create(fath ...

  6. Java基础知识二次学习--第三章 面向对象

    第三章 面向对象   时间:2017年4月24日17:51:37~2017年4月25日13:52:34 章节:03章_01节 03章_02节 视频长度:30:11 + 21:44 内容:面向对象设计思 ...

  7. 摘抄--全面理解面向对象的 JavaScript

    全面理解面向对象的 JavaScript JavaScript 函数式脚本语言特性以及其看似随意的编写风格,导致长期以来人们对这一门语言的误解,即认为 JavaScript 不是一门面向对象的语言,或 ...

  8. 零基础学Python--------第7章 面向对象程序设计

    第7章 面向对象程序设计 7.1 面向对象概述 面向对象(Object Oriented)的英文缩写是OO,它是一种设计思想.从20世纪60年代提出面向对象的概念到现在,它已经发展成为一种比较成熟的编 ...

  9. 《码出高效 Java开发手册》第二章 面向对象

    码云地址: https://gitee.com/forxiaoming/JavaBaseCode/tree/master/EasyCoding 第2章 面向对象 Object-Oriented Pro ...

随机推荐

  1. 切换到android studio遇到的svn问题

    眼下的android studio 2.0(包括preview版)都已经把git.svn,cvs 等工具集成进来了.所以,我们仅仅须要依据代码server选择使用就可以. 这里以开源中国上的git私有 ...

  2. [Fri 26 Jun 2015 ~ Thu 2 Jul 2015] Deep Learning in arxiv

    Natural Neural Networks Google DeepMind又一神作 Projected Natural Gradient Descent algorithm (PRONG) bet ...

  3. 转:分布式事务之TCC服务设计和实现注意事项

    由公司微服务培训引起的一丢丢对TCC的好奇 原文:https://yq.aliyun.com/articles/609854 一.TCC简介 TCC是一种比较成熟的分布式事务解决方案,可用于解决跨库操 ...

  4. Android 绘制圆形图片

    经常在项目中,会遇到使用圆形头像. 然而图片往往不是圆形的,我们须要对图片进行处理.以达到圆形图片的效果.这里.我总结了一下经常使用的android圆形图片的绘制的方法. 主要有以下几种方式:1.画布 ...

  5. 605B. Lazy Student(codeforces Round 335)

    B. Lazy Student time limit per test 2 seconds memory limit per test 256 megabytes input standard inp ...

  6. MapReduce:具体解释Shuffle过程

    Shuffle过程是MapReduce的核心,也被称为奇迹发生的地方.要想理解MapReduce, Shuffle是必需要了解的.我看过非常多相关的资料,但每次看完都云里雾里的绕着,非常难理清大致的逻 ...

  7. JS中split使用方法和数组中元素的删除

    JS中split使用方法和数组中元素的删除 JS中split使用方法 <script language="javascript"> function spli(){ d ...

  8. SVM中的线性分类器

    线性分类器: 首先给出一个非常非常简单的分类问题(线性可分),我们要用一条直线,将下图中黑色的点和白色的点分开,很显然,图上的这条直线就是我们要求的直线之一(可以有无数条这样的直线)     假如说, ...

  9. B5248 [2018多省省队联测]一双木棋 状压dp

    这个题当时划水,得了二十分,现在来整一整. 这个题用状压来压缩边界线,然后通过记忆化搜索进行dp.我们可以观察到,其实每次转移,就是把一个1向左移一位.最后的状态设为0. 这其中还要有一个变量来记录谁 ...

  10. MySQL-基础操作之增删改查

    1.增 (1)创建数据库dks create database dks; (2)创建名为t1的表,并指定引擎和字符集: ) not null,ages int) engine=innodb defau ...