Javascript_《JS原理、方法与实践》
《JS原理、方法与实践》学习笔记
「已注销」
这个作者很懒,什么都没留下…
展开
-
《JS原理、方法与实践》- Javascript简介
学习一门计算机语言,先要弄清楚它是什么,学习的目的是什么,如何实现的,然后再又目标地进行系统的学习。那它是什么呢?Jsvascript的历史:javascript最初由网景(Netscape)公司于1995年开发的一种脚本语言,用于给HTML网页增加动态功能。【布兰登·艾奇(Brendan Eich)】、【Livescript->Javascript】1996年11月,望京公司将Javascript提交给ECMA(欧洲计算机制造商协会)进行标准话,最后又网景、微软和Borland等公司组原创 2020-06-03 22:29:27 · 170 阅读 · 0 评论 -
《JS原理、方法与实践》- JS function 类型对象
在JS中,function可以说是最核心的内容了。它本身是一种对象,另外,它还可以创建对象, 而且可以对对象操作function的作用:作为对象来管理其中的属性作为方法处理具体业务创建对象一、创建function1. 函数声明, 结构如下:function 函数名(参数){函数体}举例:function say (what){console.log(`say ${what}`)}say('hello');2.函数表达式, 结构如下:var 变量名 = function(参数原创 2020-06-03 22:32:38 · 175 阅读 · 0 评论 -
《JS原理、方法与实践》- object类型对象
ES中一共由两种对象,function和object。object类型对象时ES的基础,它主要通过属性使用。创建object类型对象的三种方式ES中object类型的对象大致由三种创建方式:直接使用花括号创建、使用function创建、使用Object.create方法创建。直接使用花括号创建代码示例:var obj = { v: 6, innerObj: { v: 7, }, logV: function() { console.log(this.v); }};consol原创 2020-06-03 22:33:20 · 217 阅读 · 0 评论 -
《JS原理、方法与实践》- 直接量及其相关对象
直接量时指不需要创建对象就可以直接使用的变量。ES中的直接量主要有三种类型:表示字符串的string类型、表示数字的number类型和表示true/false的boolean类型。当我们直接将值赋给变量后,ES就会自动判断其类型,而且当参数发生变化后,其类型也会自动跟着变化,即ES时一种弱类型的语言。直接量直接使用两块内存来保存它们的名值对,而不像对象类型需要3块内存。直接量的封包与解包ES中有一种叫做自动封包/解包的功能,类似.net/java中的装箱/拆箱,其作用时在程序执行过程中按照需要自动在原创 2020-06-03 22:34:01 · 143 阅读 · 0 评论 -
《JS原理、方法与实践》- DOM事件
事件就是用来完成“当…时做…”的功能,也就是起监听作用。事件给我们提供了一个跟文档对象进行沟通的接口。事件主要由三部分组成:事件的目标(EventTarget)、事件监听器(EventListener)和事件本身(Event)。事件的目标可以理解为事件的主人,也就是谁的事件,在DOM中就是各种Node节点;DOM中的事件监听器可以理解为处理事件的函数;事件就是当事件目标(EventTarget)上特定的事件发生之后发送给事件监听器的信息。事件流Events子标准中规定事件的传递首先从最外层节点(Doc原创 2020-09-03 23:52:00 · 102 阅读 · 0 评论 -
《JS原理、方法与实践》- 点运算符与this关键字
点运算符点运算符可用来操作对象的属性。这里的操作可以分为获取和赋值两种类型。在赋值的情况下,如果对象原来没有所操作的属性则会添加,如果有则会修改其值。代码示例:var person = { name: 'zzh' };person.age = 18;console.log(person.name); // zzhperson.name = 'David';console.log(person.name); // Davidthis的含义书上说的三种子类型也不清楚是什么,暂且不做理解原创 2020-06-03 22:34:33 · 240 阅读 · 0 评论 -
《JS原理、方法与实践》- Global与Window对象
JS时面向对象的语言,或者说它本身就是一个大对象,就像一个大箱子里面装着很多大盒子,每个大盒子里面都装着小盒子…那么最顶层的箱子是什么呢?这个对象在ES标准中叫做Global对象。ES标准中规定Global对象要在进入执行环境前就已创建,它是所有对象的根对象,其他对下个你都是它的属性或者属性的属性。**这里的Global是表示功能的词,不代表具体的对象名。**事实上并不一定存在Global对象,但是每个具体的宿主环境都需要有一个Global对象,例如,浏览器中的window对象就是Global对象,所有其原创 2020-06-03 22:35:07 · 199 阅读 · 1 评论 -
《JS原理、方法与实践》- 类
ES6发布于2015年6月份,新增了类,模块,箭头函数等,而且新增了13个内置对象:Symble,Map,Set,WeakMap,WeakSet,ArrayBuffer,TypedArray,DataView,GeneratorFunction,Generator,Promise,Reflect,Proxy。ES2015中最大的改变应该就是启用class关键字,即类的概念。ES本身是基于对象的语言,虽然启用了类的概念,但是依然不是基于类的语言而是基于对象的语言。class的用法ES6中使用class的原创 2020-06-03 22:35:39 · 206 阅读 · 0 评论 -
《JS原理、方法与实践》- 模块
模块并不是对象,模块的使用分为两部分:定义模块和使用模块。它们一般位于不同的文件中,使用模块的文件可以调用定义模块的文件中导出的内容,有点像我们平时在一个页面中导入其他的js文件,但模块调用要比导入js文件更加强大。模块的基本用法模块最基础的用法就是导出和导入,分别使用export和import关键字来操作。只有模块中导出的变量(可以是变量,函数,类等)才可以被其他文件导入。下面使用一个React示例,展示下基本用法,以及导入后重命名,默认导出,打包导出。原因:如果通过本地加载Html 文件 (比原创 2020-06-07 15:39:53 · 125 阅读 · 0 评论 -
《JS原理、方法与实践》- ES6新增语法
let 和constvar定义的变量是function级的作用域,let定义的变量属于块级作用域,而const定义的是常量,也就是定义之后不可修改代码示例:function testVariable() { var height = 172; const name = 'zzh'; if (height === 172) { let height = 173; // name = 'zzz'; // 报错 } console.log(height); // 172原创 2020-06-07 22:21:31 · 192 阅读 · 0 评论 -
《JS原理、方法与实践》- ES6新增对象(上篇)
SymbolSymbol是ES6中新增的一种类型,其含义是符号、标志,它的作用是每调用一次都会返回一个独一无二的返回值,我们可以将此返回值作为对象的属性,这样就不会与原有的属性重名了。即使传入相同的参数,Symbol方法也会返回不同的值。Symbol只能作为方法使用,而不是使用new去创建对象。另一个作用是使用Symbol.iterator作为属性来定义遍历器。代码示例:var obj = {};var abc1 = Symbol('abc');var abc2 = Symbol('abc');原创 2020-07-04 22:26:42 · 99 阅读 · 0 评论 -
《JS原理、方法与实践》- ES6新增对象(下篇)
异步处理(Promise)ES2015中新增的Promise对象专门用于处理异步。Promise对象使用then和catch方法操作的,then方法用于执行下一步,catch方法用于执行失败后的处理。Promise实例对象的创建需要一个executor参数,executor是一个函数,在executor内部可以使用resolve和reject方法来设置业务处理完成和拒绝(失败),resolve和reject是作为executor的参数自动传入的。代码示例:var executor = function原创 2020-07-04 22:27:14 · 169 阅读 · 0 评论 -
《JS原理、方法与实践》- ES6原有对象新增属性
ES5.1中一共有11个内置对象(不包含global),分别时Function, JSON,Error,Date,Boolean,Object,String,Number,Math,RegExp,Array。在ES5.1中前5个没有发生变化,后6个发生了变化。ObjectObject新增了4个方法属性: assign,getOwnPropertySymbls,is和setPrototypeOf。1.assignassign可以将一个对象中的属性复制到另一个对象中。assign方法的语法如下:Obj原创 2020-09-03 23:49:48 · 144 阅读 · 0 评论 -
《JS原理、方法与实践》- DOM概述
什么是DOM?DOM 是一项 W3C (World Wide Web Consortium) 标准。DOM 定义了访问文档的标准:“W3C 文档对象模型(DOM)是中立于平台和语言的接口,它允许程序和脚本动态地访问、更新文档的内容、结构和样式。”W3C DOM 标准被分为 3 个不同的部分:Core DOM - 所有文档类型的标准模型XML DOM - XML 文档的标准模型HTML DOM - HTML 文档的标准模型什么是 HTML DOM?HTML DOM 是 HTML 的标准对原创 2020-09-03 23:50:24 · 105 阅读 · 0 评论 -
《JS原理、方法与实践》- DOM核心
Node在DOM中文档的结构是以节点来表示的,所有的元素(对象)都叫做节点。节点有很多类型,总的节点对象叫做Node,Node下面具体分为10个子类型,子类型中的CharacterData对象又进行细分。在DOM中,文档的所有组成部分都叫做Node(节点),例如HTML文件中的html、body、图片、文字、各种标签、以及标签的属性等。Node的不同类型节点是通过NodeType来区分的。NodeType是Node接口对象的属性,共有12个值:Node接口是多个节点类型的父接口,起始定义所有节点原创 2020-09-03 23:50:58 · 95 阅读 · 0 评论 -
《JS原理、方法与实践》- DOM中的HTML标准
虽然HTML中的接口数量非常多,但是结构很简单。首先是HTMLDocument和HTMLElement,这两个接口分别继承自Core标准中Document和Element,它们在原来的基础上添加了HTML特有的属性。然后是两个Collection: HTMLCollection和HTMLOptionsCollection。HTMLCollectionHTMLCollection用于表示HTML中相同类型节点的集合。例如:所有的div,所有的img,所有的span等等。HTMLCollection接口原创 2020-09-03 23:51:30 · 88 阅读 · 0 评论 -
《JS原理、方法与实践》- window对象
BOM是Browser Object Mode的缩写,表示浏览器对象模型。ES是一种语言,跟具体环境没关系。DOM的作用是将文档转换为相应的对象,它跟具体环境也没有关系。而DOM则是一种将浏览器这个具体的环境对应为一种对象的模型,它提供了ES跟浏览器之间进行交互的桥梁。因为DOM没有自己的标准,所以不同浏览器的实现细节并不相同,但是它们还是有很多统一的地方。虽然BOM没有自己的标准,但是HTML5标准中对BOM中的对象都做了相应的规定。如果浏览器实现HTML5标准,那么BOM的结构也就有望趋向统一,这会原创 2020-09-03 23:52:35 · 104 阅读 · 0 评论 -
《JS原理、方法与实践》- localtion对象
localtion对象的作用是对当前窗口(或框架)的地址进行读写,主要包含8个读写属性和3个方法属性。8个读写属性href: 超链接地址,页面的完整url地址内容protocol: 页面所使用的协议hostname: 主机名port: 端口号host: 主机地址,包括主机名和端口号pathname: 页面路径地址search: 查询内容hash: 锚点localtion的8个属性中,href表示完整的url地址,其他7个属性都表示url地址中的一部分。3个方法属性assign(原创 2020-09-03 23:53:09 · 521 阅读 · 0 评论 -
《JS原理、方法与实践》- 其他对象
history对象history对象用于保存window对象浏览过的历史记录,它一共包含3个方法属性和一个数值属性:go(num):跳转到指定页back(): 前一页forward():后一页length: 浏览过页面的个数go方法可以跳转到浏览过的页面,当num大于0向后(新页面)跳,num小于0时向前(旧页面)跳。back = go(-1); forward = go(1)。navigator对象navigator对象的属性保存了浏览器自身相关的信息,不同浏览器中,navigator原创 2020-09-03 23:53:46 · 116 阅读 · 0 评论 -
《JS原理、方法与实践》- HTML5简介
HTML5是近几年非常热门的话题,它提供了很多使用功能,例如:本地存储canvas作图WebSocket多线程获取地理位置富文本编辑器公式编辑器本地存储本地存储主要包含Cookie、Storage和IndexedDB数据库三种方式。不同数据库存储上限:Cookie: 4kStorage: 5M(chrome),不同浏览器上限大小不同IndexedDB: 无上限canvas作图canvas作图是通过canvas标签来完成的,但是该标签及其所对应的HTMLCanvasElem原创 2020-09-03 23:54:16 · 129 阅读 · 0 评论 -
《JS原理、方法与实践》- 本地存储
本地存储就是指在浏览器中存储数据,是相对于服务器中存储数据来说的。1. 本地存储的分类浏览器的本地存储主要包括4种方式: Cookie、Storage、SQL数据库和IndexedDB。CookieCookie提出来得最早,其最初得设计目的只是为了保存用户得登录信息,所以并不适合保存大量数据。Cookie容量小,将保存得数据拼接成字符串得形式跟程序进行操作。没打开一个网址,浏览器都会将该网站下得所有Cookie数据全部传到服务器端,因为其最初得设计目的只是用来保护用户的登录信息(例如SessionI原创 2020-09-03 23:54:56 · 150 阅读 · 0 评论