目录
第一章 JavaScript简介" >第一章 JavaScript简介
第二章 HTML中使用JavaScript" >第二章 HTML中使用JavaScript
第三章  基本概念" >第三章  基本概念
第四章  变量、作用域和内存问题" >第四章  变量、作用域和内存问题
第五章  引用类型" >第五章  引用类型
第六章  面向对象的程序设计" >第六章  面向对象的程序设计
第七章 函数表达式" >第七章 函数表达式
首页 web前端 js教程 JavaScript高级程序设计介绍

JavaScript高级程序设计介绍

Jul 18, 2017 pm 05:06 PM
javascript js 程序设计


前言:

  大致花费了一个星期的时间把这本书认真看了半本,下面是我做的阅读笔记,希望能够让看这本书的人有个大致的参考。目前可能写得较乱不够全面,后续我会整理添加。(2017-7-17) 

第一章 JavaScript简介

第二章 HTML中使用JavaScript

第三章  基本概念

3.1.语法

区分大小写

标识符(建议用驼峰大小写myCar)

注释// /**/

严格模式(use strict)

语句 建议var diff-a-b;要用分号,以及 if( test ) {  alert(test);  }一句话也要用{}

 

3.2 关键字和保留字

 

3.3 变量

未初始化undefined    var message = “hi”; message = 100; 类型随便换

 

Function test(){

Var a = “hi”; 局部

b = “hi”; 全局

}
登录后复制

Test();  alert(a); 错误  alert(b); hi

 

3.4 数据类型

typeof

Undefined (定义但未被赋值)

Null(空对象指针)

Boolean(布尔值 true false 流程控制语句会自动执行相应boolean转换)

Number

(八进制 0  十进制  十六进制 0x  浮点数值 数值范围 NaN 数值转换Number parseInt )

String(字符串,单双引号没区别,转义序列,字符串特点,toString  String)

Object(对象 所有对象的基础 var o = new Object();)

函数在ES中是对象,不是一种数据类型。

 

3.5操作符

一元操作符 ++ -- + -(可用于转换数据类型)

 

位操作符  按位非~num1 按位与& 按位或| 按位异或^ 左移<< 右移>> 无符号右移>>

 

布尔操作符 &&  ||   乘性操作符 * / %   加性操作符 + -   关系操作符 < > <= >=

 

相等操作符 ==   !=   ===  !==   条件操作符 ?:  

 

赋值操作符 =  *=  /=  %=  +=  -=  <<= >>=  >>>=

 

逗号操作符

 

3.6 语句

 

3.7 函数  

arguments      没有重载

 

第四章  变量、作用域和内存问题

4.1 基本类型和引用类型的值

动态的属性  (引用类型能动态地添加属性)

复制变量值  (基本类型是不同的空间,引用类型是引用相同的空间)

传递参数    (一样)

检测类型    (typeof  instanceof)

 

4.2执行环境及作用域

作用域链 延长作用域链(try-catch  with)  没有块级作用域(if for 声明变量 查询标识符)

 

4.3垃圾收集

策略(标记清除 引用计数)  性能问题  管理内存 

 

第五章  引用类型

5.1 Object类型

 

Var person = {};(适合给函数传入大量参数)    var parson = new Object();

 

Person[“name”](使用变量来代表属性时用)   person.name(推荐)

 

 

 

5.2 Array类型

 

Var colors = new Array();    var colors = Array();  var colors =[*****];

 

Colors[*] = *****;     colors.length

 

检测数组:  instanceof   Array.isArray()

 

转换方法:  toString()    valueOf()   toLocaleString()   join()

 

栈方法:  push()  pop()

 

队列方法: shift()  unshift()

 

重排序方法: reverse()  sort(可加入比较函数这个参数)  

 

操作方法:concat()原没变 添加    slice()原没变 截取段    splice()原变了 可删可添

 

位置方法: indexOf()  lastIndexOf()  返回项的位置

 

迭代方法:every() filter() forEach() map() some()  对每个项都进行处理,但原数组不会变

 

并归方法:reduce()顺序  reduceRight()反序   对两项一直遍历到最后

 

5.3 Date类型

 

New Date() 里面parse(“May 25,2004”) UTC(2005,0)       Date.now()

 

继承的方法:toLocaleString()  toString()  valueOf()

 

日期格式化方法:toDateString() toTimeString() toLocaleDateString() toLocaleTimeString() toUTCString()

 

日期/时间组件方法:太多具体看书

 

5.4RegExp类型

 

字面量 var pattern1 = / [bc]at / i;

 

构造函数 var pattern2 = new RegExp(“  [bc]at  ”, ” i ”);

 

RegExp实例属性 global ignoreCase lastIndex multiline source    没什么卵用

 

RegExp实例方法:exec() 捕获组(捕获多组匹配项)   text() 一次看是否匹配     

 

RegExp构造函数属性:有点多,用来看最近一次匹配的相关信息

 

模式的局限性:缺少某些语言(Perl)所支持的高级正则表达式特性,但是绝大多数情况够用

 

5.5 Function类型     函数是对象(也是Function的实例),函数名是指针。

 

function sum(num1,num2) {  }

 

Var sum = function(num1,num2){  };

 

没有重载:函数是对象,函数名是指针。

 

函数声明与函数表达式:function ******* 函数声明提升    var sum = ******* 不会提升

 

函数内部属性:arguments对象(属性callee指向函数)   this对象(指向函数执行的环境对象)      属性caller (指向调用当前函数的函数,如果是全局作用域的函数则值为null)

 

函数属性和方法:

 

属性(length声明参数个数  prototype继承)  

 

非继承方法: call()    apply()   bind()

 

a.apply( b, c);  a.call( b, d );      

 

在环境对象b里运行函数a ,顺便给a传入参数c( argument或者 数组)  /  d( 每项写 出来 )  

 

Var a = b.bind(c);

 

a 是在c环境对象里运行的函数

 

5.6基本包装类型:

 

Boolean类型:var booleanObject = new Boolean(true);  建议永远不要使用Boolean对象。

 

 

 

Number类型:var numberObject = new Number(10);  toFixed()  toExponential()  toPrecision()

 

也建议不要直接实例化Number类型。

 

 

String 类型:var stringObject = new String(“hello world”);  length属性  

 

1.字符方法:charAt()或者string[]   返回对应字符     charCodeAt()   返回对应字符编码

 

2.字符串操作方法:

 

concat() 或者 +操作符 和数组的concat()看起来一样  

 

Slice()  substring()  substr()  截取字符串,三个很灵活

 

3.字符串位置方法:indexOf()   lastIndexOf()

 

4.trim()方法  删除前置及后缀的所有空格     trimLeft()  trimRight()

 

5.字符串大小写转换方法

 

toLowerCase()  toUpperCase() 经典方法

 

toLocaleLowerCase()  toLocaleUpperCase() 特定地区   这种更加稳妥

 

6.字符串的模式匹配方法

 

match() RegExpexec()本质一样 返回匹配到字符串的数组

 

search() 返回第一个匹配项的索引 否则返回-1

 

replase() 匹配且替换字符串

 

split() 匹配分隔符生成数组

 

7.localeCompare()   比较两个字符串

 

8.fromCharCode()   静态方法    将多个字符编码变成字符串

 

9.HTML方法    比如big()     string

 

5.7 单体内置对象

 

1.Global对象

 

URL编码方法:

 

encodeURI() 整个     encodeURIComponent() 某一段    编码

 

decodeURI() 整个     decodeURIComponent() 某一段    解码

 

eval()方法  非常强大 也非常危险 ECMAScript解析器

 

Global对象的属性     undefinedArray.........都是属性

 

Web浏览器是将全局对象作为window对象的一部分加以实现的

 

2.Math对象

 

Math对象的属性    一些特殊值比如π

 

min() max() 方法

 

舍入方法:小数值变整数    

 

Math.ceil(25) 进一    Math.floor(25) 退一    Math.round(25) 四舍五入

 

random()方法   [0,1) 之间的随机数

 

其它方法  太多看书

 

第六章  面向对象的程序设计

 

6.1理解对象

 

6.1.1属性类型:

 

数据属性:4个特性  

 

访问器属性:不包含数据值 4个特性 通过Object.defineProperty()定义

 

6.1.2定义多个属性: Object.defineProperties()  可以是数据属性,也可以是访问器属性。

 

6.1.3读取属性的特性:Object.getOwnPropertyDescriptor()

 

 

6.2创建对象

 

6.2.1工厂模式(看书)

 

6.2.2构造函数模式(看书  new  constructor  )

 

6.2.3原型模式:

 

1.理解原型对象

 

2.原型与in操作符( in  for-in )

 

3.更简单的原型语法( 对象字面量来访问对象 )

 

4.原型的动态性( 原型可以换成另外一个对象,但对已经创建的实例无效了 )

 

5.原生对象的原型( 就是用原型模式,可以定义新方法在里面,但是不推荐)

 

6.原型对象的问题:没有属于实例自己的属性

 

6.2.4组合使用构造函数模式和原型模式

 

最常见的模式,实例有自己的属性和方法,也有共享的。

 

6.2.5动态原型模式

 

在上面的模式再加一个判断语句,来动态在原型中加入方法。

 

6.2.6寄生构造函数模式

 

和工厂模式的区别就一个new,还有它有多个return。返回的对象和构造函数没有关系,导致不能用instanceof操作符来确定对象的类型。不太建议使用。

 

6.2.7稳妥构造函数模式

 

跟寄生构造函数模式有相似处,但不用thisnewinstanceof也检测不出

 

 

6.3继承

 

6.3.1原型链   原型搜索机制

 

1.别忘了默认的原型:所有函数的默认原型都是Object的实例。

 

2.确定原型和实例的关系:instanceof    isPrototypeOf()

 

3.谨慎地定义方法:必须在实例替换原型之后才能定义新的方法。

 

4.原型链的问题:

 

在原型外的属性也给继承了

 

在创造子类型的实例时,不能向超类型的构造函数中传递参数。

 

很少单独使用。

 

6.3.2借用构造函数 利用callapply 来继承和传递参数  但是只能使用构造函数模式。

 

也很少单独使用。

 

6.3.3组合继承

 

原型链实现 原型属性和方法的继承

 

借用构造函数实现 对实例属性的继承

 

最常用的继承方式

 

6.3.4原型式继承(看书)  

 

没有用到构造函数 保持类型可以用用,但是会跟原型模式一样共享引用类型的属性。

 

6.3.5寄生式继承(看书)

 

不考虑构造函数 可以用用  但是不能做到函数复用

 

6.3.6寄生组合式继承(看书)

 

组合继承有问题:调用了两次超类型的构造函数,导致实例和原型中重复了属性。

 

寄生组合式继承解决了这个问题,成为了最理想的继承范式。

 

 

第七章 函数表达式

定义函数方式:

 

函数声明( 函数声明提升 有name)   

 

函数表达式( name为空 匿名函数/命名 一般函数表达式都是匿名函数 )

 

7.1递归

 

严格模式不能用 arguments.callee  可以用命名函数表达式。

 

 

7.2闭包:有权访问另一个函数作用域中的变量的函数

 

自我总结:闭包是函数,一般用匿名函数

 

1.闭包可以访问返回外部函数中的变量。

 

2.另一个函数的活动对象会被保存,直到闭包的作用域链被销毁。

 

7.2.1闭包和变量  

 

副作用:闭包的作用域链上保存的是整个变量对象,所以返回的变量是保存的最后一个值。

 

比如在for循环中,则会出现不如意的情况。

 

7.2.2关于this对象

 

闭包中的this对象,闭包可能在某些特殊情况被放到全局对象上,从而this变却不自知。

 

7.2.3内存泄漏

 

使用闭包,确保正常回收内存

 

 

7.3模仿块级作用域

 

用匿名自执行函数来模仿。

 

自我总结作用:

 

1.内部执行完就会摧毁。

 

2.匿名自执行函数可以减少污染全局方法和属性。

 

闭包就有一个内存的问题,用这个结合很舒适。

 

 

7.4私有变量

 

对象上的都是公有的    函数里面的都是私有的

 

通过闭包来创建函数的公有方法(特权方法)    ---------用来获取私有变量

 

在构造函数中创建                         -------- 构造函数this   浪费内存

 

例子:this.****** = function(){ **** };

 

但是每个实例化都会重新构建一组方法,浪费。

 

 

7.4.1静态私有变量                   ---------原型   每个实例没有自己的私有属性

 

静态就用  私有作用域   通过闭包在全局的构造函数的原型里面来创建特权方法。

 

增进了代码的重用性,但是每个实例没有自己的私有变量。(因为这个叫静态私有变量)

 

使用实例变量,还是静态私有变量,看具体需求。

 

 

7.4.2模块模式                     ---------return返回对象字面量    一个实例对象

 

为单例创建私有变量和特权方法(单例:只有一个实例的对象)

 

在匿名函数内部定义私有变量和方法,然后将一个对象字面量作为函数的返回值。

 

 

7.4.3增强的模块模式

 

必须是某种类型的实例,同时还必须添加某些属性或方法。

 

以上是JavaScript高级程序设计介绍的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
2 周前 By 尊渡假赌尊渡假赌尊渡假赌
仓库:如何复兴队友
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
3 周前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

如何使用WebSocket和JavaScript实现在线语音识别系统 如何使用WebSocket和JavaScript实现在线语音识别系统 Dec 17, 2023 pm 02:54 PM

如何使用WebSocket和JavaScript实现在线语音识别系统引言:随着科技的不断发展,语音识别技术已经成为了人工智能领域的重要组成部分。而基于WebSocket和JavaScript实现的在线语音识别系统,具备了低延迟、实时性和跨平台的特点,成为了一种被广泛应用的解决方案。本文将介绍如何使用WebSocket和JavaScript来实现在线语音识别系

股票分析必备工具:学习PHP和JS绘制蜡烛图的步骤 股票分析必备工具:学习PHP和JS绘制蜡烛图的步骤 Dec 17, 2023 pm 06:55 PM

股票分析必备工具:学习PHP和JS绘制蜡烛图的步骤,需要具体代码示例随着互联网和科技的快速发展,股票交易已经成为许多投资者的重要途径之一。而股票分析是投资者决策的重要一环,其中蜡烛图被广泛应用于技术分析中。学习如何使用PHP和JS绘制蜡烛图将为投资者提供更多直观的信息,帮助他们更好地做出决策。蜡烛图是一种以蜡烛形状来展示股票价格的技术图表。它展示了股票价格的

推荐:优秀JS开源人脸检测识别项目 推荐:优秀JS开源人脸检测识别项目 Apr 03, 2024 am 11:55 AM

人脸检测识别技术已经是一个比较成熟且应用广泛的技术。而目前最为广泛的互联网应用语言非JS莫属,在Web前端实现人脸检测识别相比后端的人脸识别有优势也有弱势。优势包括减少网络交互、实时识别,大大缩短了用户等待时间,提高了用户体验;弱势是:受到模型大小限制,其中准确率也有限。如何在web端使用js实现人脸检测呢?为了实现Web端人脸识别,需要熟悉相关的编程语言和技术,如JavaScript、HTML、CSS、WebRTC等。同时还需要掌握相关的计算机视觉和人工智能技术。值得注意的是,由于Web端的计

WebSocket与JavaScript:实现实时监控系统的关键技术 WebSocket与JavaScript:实现实时监控系统的关键技术 Dec 17, 2023 pm 05:30 PM

WebSocket与JavaScript:实现实时监控系统的关键技术引言:随着互联网技术的快速发展,实时监控系统在各个领域中得到了广泛的应用。而实现实时监控的关键技术之一就是WebSocket与JavaScript的结合使用。本文将介绍WebSocket与JavaScript在实时监控系统中的应用,并给出代码示例,详细解释其实现原理。一、WebSocket技

PHP与JS开发技巧:掌握绘制股票蜡烛图的方法 PHP与JS开发技巧:掌握绘制股票蜡烛图的方法 Dec 18, 2023 pm 03:39 PM

随着互联网金融的迅速发展,股票投资已经成为了越来越多人的选择。而在股票交易中,蜡烛图是一种常用的技术分析方法,它能够显示股票价格的变化趋势,帮助投资者做出更加精准的决策。本文将通过介绍PHP和JS的开发技巧,带领读者了解如何绘制股票蜡烛图,并提供具体的代码示例。一、了解股票蜡烛图在介绍如何绘制股票蜡烛图之前,我们首先需要了解一下什么是蜡烛图。蜡烛图是由日本人

简易JavaScript教程:获取HTTP状态码的方法 简易JavaScript教程:获取HTTP状态码的方法 Jan 05, 2024 pm 06:08 PM

JavaScript教程:如何获取HTTP状态码,需要具体代码示例前言:在Web开发中,经常会涉及到与服务器进行数据交互的场景。在与服务器进行通信时,我们经常需要获取返回的HTTP状态码来判断操作是否成功,根据不同的状态码来进行相应的处理。本篇文章将教你如何使用JavaScript获取HTTP状态码,并提供一些实用的代码示例。使用XMLHttpRequest

JavaScript和WebSocket:打造高效的实时天气预报系统 JavaScript和WebSocket:打造高效的实时天气预报系统 Dec 17, 2023 pm 05:13 PM

JavaScript和WebSocket:打造高效的实时天气预报系统引言:如今,天气预报的准确性对于日常生活以及决策制定具有重要意义。随着技术的发展,我们可以通过实时获取天气数据来提供更准确可靠的天气预报。在本文中,我们将学习如何使用JavaScript和WebSocket技术,来构建一个高效的实时天气预报系统。本文将通过具体的代码示例来展示实现的过程。We

js和vue的关系 js和vue的关系 Mar 11, 2024 pm 05:21 PM

js和vue的关系:1、JS作为Web开发基石;2、Vue.js作为前端框架的崛起;3、JS与Vue的互补关系;4、JS与Vue的实践应用。

See all articles