
JavaScript学习笔记
文章平均质量分 89
学习犀牛书时的简单笔记摘要
走在大前端的路上
一个走在大前端路上的程序猿。
展开
-
第二十一章:多媒体和图形编程
在浏览器中动态生成复杂图形是非常重要的,因为: 用于在客户端生成图形的代码大小要比图片本身小很多,这样可以减少部分带宽。 通过一些实时数据来动态生成图形,需要消耗大量的CPU周期。而如果把这个任务放到客户端做,就可以有效地减轻服务器的负担,某种程度上也是节约了硬件开销。 在客户端生成图形也是符合现代Web应用的架构:服务器提供数据,然后客户端负责展现这些数据。脚本化图片 如下的HTML代码段是一个非常简单的例子:它创建一张图片,并在鼠标指针经过的时候改变该图...原创 2021-08-13 13:47:18 · 323 阅读 · 0 评论 -
第二十章:客户端存储
客户端存储概述 web应用允许使用浏览器提供的API实现将数据存储在用户电脑上。客户端存储遵循“同源策略”,因此不同站点的页面是无法读取对于存储的数据。而同一站点的不同的页面之间是可以互相共享存储数据的。 web应用可以选择他们存储数据的有效期:有临时存储的,可以让数据保存至当前窗口关闭或浏览器退出;也有永久存储,可以将数据永久地存储在硬盘上,数年或者数月不失效。 客户端存储有以下几种形式:web存储 先是作为HTML5的一部分被定...原创 2021-08-02 17:46:38 · 535 阅读 · 0 评论 -
第十九章:jQuery类库
jQuery作为js最流行和广泛采用的类库之一,具有如下特性:丰富强大的语法(CSS徐选择器),用来查询文档元素; 高效的查询方法,用来找到与CSS选择器匹配的文档元素集; 一套有用的方法,用来操作选中的元素; 强大的函数式编程技巧,用来批量操作元素集,而不是每次只操作单个; 简洁的语言用法(链式调用),用来表示一系列顺序操作。jQuery基础 jQuery类库定义了一个全局函数:jQuery()。该函数使用频繁,因此在类库中还给它定义了一个快捷别名:$。调...原创 2021-07-30 18:10:03 · 538 阅读 · 0 评论 -
第十八章:脚本化HTTP
HTTP概述超文本传输协议(http)规定web浏览器如何从web服务器获取文档和向web服务器提交表单内容,以及web服务器如何响应这些请求和提交。通常http并不在脚本的控制下,只是当用户单击链接,提交表单和输入URL时才发生 。但是用js来操纵http是可行的,当脚本设置window对象的location属性(当然改变location的hash锚点不算)或调用表单对象的submit方法时,都会初始化http请求。 Ajax(Asynchronous JavaSc...原创 2021-07-28 15:32:31 · 315 阅读 · 0 评论 -
第十七章:事件处理
事件处理概述客户端JavaScript程序(浏览器)采用了异步事件驱动编程模型(我的理解是交互驱动)。当文档、 浏览器、元素或与之相关的对象发生某些有趣的事情时,Web浏览器就会产生事件(event)。如果JavaScript应用程序关注特定类型的事件,那么它可以注册当这类事件发生时要调用的一个或多个函数。这种风格并非Web编程独有,所有使用图形用户界面的应用程序都采用了它。 一些重要的定义:1⃣️事件类型(event type):是一个用来说明发...原创 2021-07-28 11:34:44 · 1041 阅读 · 0 评论 -
第十六章:脚本化CSS
CSS概览层叠样式表(Cascading Style Sheet,CSS)是一种指定HTML文档视觉表现的标准。使用CSS可以精确地指定文档元素的字体、颜色、外边距、缩进、边框,甚至定位。 HTML文档的视觉显式包含很多变量:字体、颜色、间距等。CSS标准列举了这些变量,我们称之为样式属性。CSS定义了这些属性以指定字体、颜色、外边距、边框、背景图片、文本对齐方式、元素尺寸和元素位置。 有两种方式将一组定义视觉表现的CSS属性和对应的HTML元素...原创 2021-07-27 14:54:21 · 245 阅读 · 0 评论 -
第十五章:脚本化文档
文档对象模型DOM(Document Object Model),文档对象模型。简单的说就是一套操作文档内容的方法。 文档:D 如果没有document(文档),DOM就无从谈起。当创建了一个网页并把它加载到web浏览器中,DOM就悄然而生,它将根据你编写的网页文档创建一个文档对象。 对象:O javascript中的对象分为三种:用户自定义对象(用户自己创建的对象);...原创 2021-07-26 18:00:48 · 163 阅读 · 0 评论 -
第十四章:Window对象
window对象是BOM(浏览器对象模型)中所有对象的核心,除了是BOM中所有对象的父对象外,还包含一些窗口控制函数。 全局的window对象 JavaScript中的任何一个全局函数或变量都是window的属性。 <script type="text/javascript">let name = "Windows BOM";document.write(window.name);</script>window与self对象...原创 2021-07-26 15:40:59 · 433 阅读 · 0 评论 -
第十章:正则表达式的匹配模式
正则表达式的定义 正则表达式(regular expression)是用于匹配字符串中字符组合的模式。在JavaScript中,正则表达式是一个描述字符模式的对象。RegExp对象更多的是通过一种特殊的直接量语法来创建。 正则表达式的模式规则是由一个字符序列组成的,包括所有字母和数字在内,大多数的字符都是按照直接量仅描述待匹配字符的。 可以使用以下两种方法之一构建一个正则表达式: ①直接量语法 let pattern = /s$/;...原创 2021-07-26 13:31:22 · 874 阅读 · 0 评论 -
第九章:类和模块
原型和原型链是JavaScript中的难点也是重点,这里建议先阅读第六章中关于原型和原型链的部分再来阅读此处。 原型所有对象(null除外)都拥有__proto__属性,该属性是一个指针,指向该对象的构造方法(对象)的prototype对象(隐式原型)。 所有函数拥有prototype属性(显式原型,仅限函数),这个属性是一个指针,指向一个对象,这个对象的用途就是包含所有实例共享的属性和方法(该对象叫做原型对象)。原型对象也有一个属性,叫做constructor,...原创 2021-07-23 17:53:48 · 208 阅读 · 1 评论 -
第八章:函数
函数创建函数的最大作用是提供代码复用,将需要重复使用的代码块定义成函数,提供更好的代码复用。函数可以有返回值,可以没有返回值。 函数的创建有三种方式,分别为使用Function的构造函数、函数声明、函数表达式:①Function构造函数 这种方式是直接new出来一个Function 实例,通过使用Function的构造函数进行创建函数。Function构造函数可以接收任意多个参数,但是最后一个参数会被认为是函数体,前面的所有参...原创 2021-07-23 16:23:01 · 156 阅读 · 0 评论 -
第七章:数组
数组的创建 //创建一个数组let colors = new Array(); //Array []//创建一个数组并指定长度let colors = new Array(20); //Array(20)//创建一个数组并赋值let colors = new Array("red","blue","green");//Array(3)["red","blue","green" ]在创建数组的时候,最好采用省略new操作符的形式,数组中可以存储不同类型的元素,如下: ...原创 2021-07-23 11:21:51 · 196 阅读 · 0 评论 -
第六章:对象
对象是JavaScript的一个基本数据类型,是一种复合值,它将很多值(原始值或者其他对象)聚合在一起,可通过名字访问这些值,即属性的无序集合。 对象的创建 1、对象直接量 / 字面量 let obj = { name: 'yh', age: 18}console.log(obj.name);2、构造函数 (1)系统自带的, 如: let o = new Object(); //相当于 let o = {};o.name= "yh";...原创 2021-07-22 16:02:36 · 322 阅读 · 0 评论 -
第五章:语句
表达式语句 具有副作用的表达式是JavaScript中最简单的语句,这里的副作用指的是对变量产生的影响,最显著的是改变其值。 赋值语句是一类比较重要的表达式语句,例如:let a = 1;a += 1;a++; //递增++和递减--运算符和赋值语句有关,它们的作用是改变一个变量的值, //就像执行一条赋值语句一样a--; 函数调用是表达式语句的另一个大类,例如:let a = "Hello";alert(a);win...原创 2021-07-21 15:09:18 · 214 阅读 · 0 评论 -
第四章:表达式和运算符
表达式概述 表达式是javascript中的一个短语,javascript解释器会将其计算出一个结果。程序中的常量是最简单的一类表达式。变量名也是一种简单的表达式,它的值就是赋值给变量的值。复杂的表达式是由简单的表达式组成的。比如数组访问表达式是由一个表示数组的表达式,方括号、一个整数表达式构成。它们所组成新的表达式运算结果是该数组特定位置的元素值。同样的,函数调用表达式由一个表示函数对象的表达式和0个多个参数表达式构成。将简单表达式组成复杂表达式最常用的方法就是使用运算符...原创 2021-07-21 09:46:29 · 337 阅读 · 2 评论 -
第三章:类型、值和变量
在编程语言中,能够表示并操作的值的类型称为数据类型(type)。 JavaScript的数据类型分为两类:原始类型和对象类型。5种原始类型:数 字、字符串、布尔值、null(空)、undefined(未定义)。原始类型之外的就是对象类型了,对象是属性的集合,每个属性都由“名/值对”(值可以是原始 值、也可以是对象)构成。 普通的JavaScript对象是“命名值”的无序集合,特殊对象--数组表示带编 号的值的有序集合。另一特殊对象--函数是具有与它相关...原创 2021-07-20 16:27:25 · 428 阅读 · 1 评论 -
第二章:词法结构
字符集JavaScript程序是用Unicode字符集编写的。 JavaScript是区分大小写的语言。即关键字、变量、函数名和所有标识符 (identifier)都必须采取一致的大小写形式。如:“name”和“Name”是不 同的变量。 在JavaScript中,会忽略程序中标识之间的空格。而对于换行符, JavaScript在多数情况下也会忽略,但有一种情况例外:当在return、break、 continue语句后添加换行符时,JavaScr...原创 2021-07-19 16:59:37 · 144 阅读 · 0 评论 -
第一章:JavaScript概述
前言最近几个月忙着做公司的项目重构,坑比较多,项目重构没有使用任何框架(vue或react),而是采用原生html + js + jQuery的形式,js基础还是很重要的,所以整理了一下自己刚入职时学习犀牛书的学习笔记。第一章:JavaScript概述通过方括号定义数组元素和通过花括号定义对象属性名和属性值之间的映射 关系的语法称为初始化表达式。表达式是JavaScript中的一个短语,这个短语可以通过运算得出一个值。 通过" . "和" [ ]...原创 2021-07-19 16:32:11 · 179 阅读 · 1 评论