说明(2017.3.30): 1. 使用软件diagram designer,DiagramDesignerSetup1.28.zip,很小只有1M多,我用的自带画图软件.教学视频是“JavaScript高级面向对象视频教程视频”02里的03,蒋坤主讲. 2. 题目: (1)var arr = [1,2,3]; (2)var o = {name: "张三", age: "19", children: [{name: "张1"}, {name: &…
  引言 C++ 构造函数的执行过程(一) 无继承 本篇介绍了在无继承情况下, C++构造函数的执行过程, 即成员变量的构建先于函数体的执行, 初始化列表的数量和顺序并不对构造函数执行顺序造成任何影响. 还指出了初始化列表会影响成员变量的构造方式, 分析了为何要尽可能地使用初始化列表. 关于在继承的情况下, C++构造函数的执行过程, 请期待第二篇.   本文所依赖的环境如下: 平台: Windows 10 64位 编译器: Visual Studio 2019   一. 构造函数的执行顺序  …
二.继承 OO是面向对象语言最为有魅力的概念.一般的OO语言都实现了两种继承,接口继承和实现继承.接口继承只继承方法签名,而实际继承继承了实际的方法. 而在JS中,函数没有签名,所以无法实现接口继承.只能依靠原型链--实现继承. 2.1原型链 JS中描述了原型链的概念,并利用原型链作为实现继承的主要方法. 其基本思想:利用原型链让一个引用类型继承另一个引用类型的属性和方法. functionSuperF(){ this.superPropty ='B'; } SuperF.prototype.g…
执行环境及作用域 执行环境(execution context,为简单起见,有时也称为“环境”)是JavaScript 中最为重要的一个概念.执行环境定义了变量或函数有权访问的其他数据,决定了它们各自的行为.每个执行环境都有一个与之关联的变量对象(variable object),环境中定义的所有变量和函数都保存在这个对象中.虽然我们编写的代码无法访问这个对象,但解析器在处理数据时会在后台使用它.全局执行环境是最外围的一个执行环境.根据ECMAScript 实现所在的宿主环境不同,表示执行环境的…
说明(2017-4-2 21:50:45) 一.构造函数是干什么用的: 1. 初始化数据的. 2. 在js给对象添加属性用的,初始化属性值用. 二.创建对象的过程: 1. 代码:var p = new Person(); 2. 首先运算符new创建了一个对象,它类似于{},是一个“没有任何成员”的对象. * 使用new创建对象,对象的类型就是创建它的构造函数名(如,Person类型). * 使用{}无论如何都是Object类型,相当于“new Object()”. 3. 然后调用构造函数为其初始…
创建对象 继承 面向对象的语言都有一个表示---类.通过类我们可以创建多个具有相同属性的对象.但是,在JS中并没有类的概念,所以JS的对象也和其他语言的对象不同. 对象的定义:无序的属性集合,其属性可以包含基本值,对象,函数.(所以我们又可以把JS对象看成散列表,一组键值对.) 一.创建对象   1.1工厂模式 function createPerson(name,age){ var o =newObject(); o.name = name; o.age= age; o.sayName =fu…
说明(2017-4-2 18:27:11): 1. 作为函数的参数,就是将函数的数据拷贝一份,传递给函数的定义中的参数. 函数foo()在调用的时候,做了两件事: (1)函数在调用的时候,首先需要将参数中的数据拷贝一份,即数字123拷贝一份. (2)跳转到函数的定义中(函数体),在此之前完成了函数的赋值,即num=123. (3)正式的进入函数内,准备执行函数的每一句话. function foo(num){} var a = 123; foo(a); 2. 值类型作为函数参数传递的特征,函数内…
说明(2017.3.28): 1. JavaScript是一种基于对象的多范式编程语言,不是面向对象,但离开对象不能活. 范式编程是指编程习惯.方式,分为过程式.对象式和函数式编程. 2. 面向对象是指,使用对象进行开发,面向对象是对面向过程的封装. 3. JavaScript面向对象的三个特点,抽象性.继承性和封装性. 抽象性是指,抽取出核心属性和方法,不在特定条件下不能确定对象的具体意义. 继承性是指,把我没有的属性和方法拿来使用,并变成自己的属性和方法. 封装性是指,把方法和属性打包成一个…
JavaScript与HTML之间的交互是通过事件实现的. 一.事件流 首先我们要明白事件流的概念.当我们点击一个按钮时,也点击了按钮的容器元素,甚至也点击了整个事件.事件流描述就是从页面中接收事件的顺序.在主流浏览器中有两种事件接收方式.一种是IE提出的事件冒泡流,另一种是Netscape提出的事件捕获流.顾名思义,事件冒泡流是从被点击的最小元素逐渐向上索引DOM树,而事件捕获的思想是不太具体的节点先捕捉到事件,然后事件沿DOM树逐渐向下,一直传播到事件的实际目标. 由于老版本浏览器不支持事件…
使用hasOwnProperty()方法检测一个属性存在实例还是原形中,当属性存在对象实例中时,返回true alert(person1.hasOwnProperty("name")); //false 来自原型 原型和in操作符 单独使用和for-in中,单独使用时无论属性存在于实例中还是原型中都返回true ECMAScript 5的Object.keys()方法,接收一个对象作为参数,返回一个包含所有可枚举属性的字符串数组(参数是实例则返回实例的属性,是原型则返回原型的属性) v…
说明(2017.4.2): 1. 对象的动态特性: (1)在js中,一个对象需要属性,就可以利用“对象名.属性 = 值”的方式为其添加,只要赋值成功,对象就新增这个属性. (2)对象属性的访问形式: *点语法:o.name *关联数组:o[name],注意,name必须是一个字符串,否则会把name默认为一个变量名使用. (3)曾经使用: function mix(o1,o2){ for(var k in o2){ o1[k] = o2[k]; } } (4)凡是需要给对象动态添加成员的时候,必…
说明(2017.4.2): 1. 在body中放一个img标签,src链接一张图片,那么页面会先读取html的document文档,然后再读取外部资源(这里没加onload其实就是从上往下顺序读取). 外部资源包括导入的js,css,图片,音乐,视频等等. onload会将所有的资源包括外部资源全部加载完成. 而jquery的ready只要加载完dom树就完成了,里面的图片等资源有没有加载无所谓. <body> <img src="1.jpg"> </bo…
说明(2017.4.1): 1. 深拷贝要把对象里的“方法”也复制一份出来,“方法”里的“方法和属性”再判断深浅进行拷贝. 2. 办法就是写一个函数deepCopy,里面判断深浅拷贝,然后每个对象都添加这个deepCopy函数. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title&g…
说明(2017.3.31): 1. 浅拷贝,只有值属性,没有引用属性. 2. 在原对象里面添加一个copy方法,返回本对象内的所有值属性. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <script type…
说明(2017.3.30): 1. 最简单的继承方式,混入mix <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <script type="text/javascript"> // 最…
说明(2017.3.29): 1. 在调试工具console里输入var v = document.createElement("audio"),然后再source的watch里输入v回车,就能看到audio的所有事件,本次使用的是onended事件. 2. json不能直接遍历获得索引,只能通过for循环获取个数,再用for循环遍历.所以最好用数组存放歌名. <!DOCTYPE html> <html lang="en"> <head…
说明(2017.3.31): 1. 画图: var car = {name:"法拉利"}; var p = {name: "张三", age: "19", car: car}; // var pCopy = p;这个不是拷贝,没有对对象做任何拷贝行为 var pCopy = {}; pCopy.name = p.name; pCopy.age = p.age; pCopy.car = p.car; 2. 什么是深拷贝,什么是浅拷贝: 深拷贝:拷贝…
说明(2017.3.31): 1. 画图: var num = 123; var num2 = num; 值类型赋值的存储特点:将变量num内的数据全部拷贝一份,存储给新的变量num2,内存中有2个数据. 2. 画图: var o = {name: "张三"}; var obj = o; 引用类型赋值的特点:将变量o的引用(地址)拷贝一份,所以新的变量obj也指向了这个对象{name: "张三"},内存中只有一个数据. 但是这样有个问题,如果修改了obj里的name…
说明(2017.3.30): 1. 变量只存数据本身就是值类型,如var a = 123, var a = "123";  变量存的是一个引用,数据存在别的地方,就是引用类型,如数组var a = [1,2,3]. 对比冬天和夏天衣服,放在同一个衣柜里,和分别放在不同房间,告诉房间编号. 2.…
说明(2017.3.29): 1. 数字+上下文=信息,如果是做数学运算,就是数字,如果是输出字符串给用户,就是码表字符. 2. ASCII码,共128个数字,128个数字刚好7个二进制位(2的7次方=128),0~127. ※ 位就是位置,一个字节有8个二进制位,计算机运行的最小单位是字节,所以总归都是要把位转换成字节的, 第2位就是把字节转换成8个二进制位的时候,第2个0/1,其中1:1,2:10,3:11,4:100,...,255:11111111(8个1,最左边的1是最高位或第7位,最…
欢迎关注本人的微信公众号"前端小填填",专注前端技术的基础和项目开发的学习. 本节内容对应<JavaScript高级程序设计>的第六章内容. 1.面向对象(Object-Oriented, OO)的语言有一个标志,那就是它们都有类的概念,而通过类可以创建任意多个具有相同属性和方法的对象.前面提到过,ECMAScript中没有类的概念,因此它的对象也与基于类的语言中的对象有所不同. ECMA-262把对象定义为:"无序属性的集合,其属性可以包含基本值.对象或者函数.…
javascript高级特性(面向对象): * 面向对象: * 面向对象和面向过程的区别: * 面向对象:人就是对象,年龄\性别就是属性,出生\上学\结婚就是方法. * 面向过程:人出生.上学.工作.结婚.生子.去世整个过程. * 对象和类的区别: * 类:类比作一堆美女. * 对象:对象就是范冰冰. * javascript的开发工具: * WebStrom开发工具,在国内被专业的前端开发人员称之为js神器. * 代码提示功能非常强大. * javascript的扩展内容: * 服务器端开发人…
对象:任何事物都可以看作是对象. 1.面向对象与面向过程的概念 面向过程:凡是自己亲力亲为,自己按部就班的解决现有问题. 面向对象:自己充当一个指挥者的角色,指挥更加专业的对象帮我解决问题. 联系:面向对象仍然离不开面向过程,可以认为它是对面向过程更高一层的封装. 2.创建对象的方式 字面量形式 var p = {}; p.name = '中国人'; p.age = '500'; 构造函数形式 ==> 复用性更强 function Person(name, age) { this.name =…
相关文章: 面向对象的程序设计(一) — 创建对象 http://www.cnblogs.com/blackwood/archive/2013/04/24/3039523.html 继承 继承是OO语言中的一个最为人津津乐道的概念. 许多OO语言都支持两种继承方式:接口继承和实现继承. 接口继承只继承方法签名,而实现继承则继承实际的方法. 如其所述,由于函数没有签名,在ECMAScript中无法实现接口继承. ECMAScript只支持实现继承,而且其实现继承主要是依靠原型链来实现的. 原型链…
javascript函数执行过程: 1. 为函数创建一个执行环境 2. 复制函数的 [[scopes]] 属性中的对象构建起执行环境的作用链域 3. 创建函数活动对象并推入执行环境作用链域的前端 4. 执行代码 5. 销毁执行环境和活动对象(闭包情况下活动对象仍被引用没被销毁) 用例子来说明: function Person(name) { this.getName = function() { return name; }; this.setName = function(value) { n…
ECMAScript虽然是一种面向对象的语言,但是他没有类的概念.所以他的对象也与其他语言中的对象有所不同. ECMA-262定义对象:一组没有特定顺序的值. 6.1 理解对象 创建对象的方法: 1. 最简单直接的方式——Object构造函数 var person = new Object(); person.name = "Nicholas"; person. age = 29; person.job = "Software Engineer"; person.s…
对象创建方法: 工厂方法 构造函数模式 原型模式 组合构造函数和原型模式 寄生构造函数模式 问题构造函数模式 工厂模式: function Person(name, age){ var obj = new Object(); //创建对象 obj.name = name; //添加方法.属性 obj.age = age; obj.sayName = function(){ alert(this.name); } return obj; //返回对象 }var people = Person("y…
javascript是由浏览器解释执行的脚本语言,不同于java c,需要先编译后运行,javascript 由浏览器js解释器进行解释执行,总的过程分为两大块,预编译期和执行期 下面的几个demo解释了js解释器对变量和代码的解释过程 //#demo1 foo();//alert(1) function foo(){//声明式函数 alert(1); } foo2();//undefined is not a function var foo2 = function(){//赋值式函数声明,其…
下面我们以更形象的示例来说明JavaScript代码在页面中的执行顺序.如果说,JavaScript引擎的工作机制比较深奥是因为它属于底层行为,那么JavaScript代码执行顺序就比较形象了,因为我们可以直观感觉到这种执行顺序,当然JavaScript代码的执行顺序是比较复杂的,所以在深入JavaScript语言之前也有必要对其进行剖析. 1.1  按HTML文档流顺序执行JavaScript代码 首先,读者应该清楚,HTML文档在浏览器中的解析过程是这样的:浏览器是按着文档流从上到下逐步解析…
Js,Javascript加载与函数执行过程 test.html <!DOCTYPE HTML> <html lang="en"> <head> <meta charset="utf-8" /> <title>demo</title> <script type="text/javascript"> function hello(){ alert("hel…