自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(48)
  • 收藏
  • 关注

原创 闭包、柯里化

闭包什么是闭包?闭包就是函数套函数,执行外部函数时返回内部函数,并且内部函数有权调用外部函数作用域中局部变量。使用闭包会产生私有变量的存在,解决变量污染。当引用的js文件中变量名相同时,这种称之为变量污染函数中的局部变量当函数执行完成后,局部变量就会被销毁,垃圾回收机制,将不需要使用的数据进行清除,如果不清除就会造成内存泄露柯里化接收多个参数的函数变换成接收单一参数的函数,嵌套返回直到所有参数都被使用并返回最终结果换句话说就是将函数的调用方式从fn(1,2,3)转变成fn

2022-04-05 13:06:04 612

原创 Js - 严格模式、解构赋值、对象基础

严格模式 use strict解构赋值的各种方法对象的各种方法

2022-03-30 23:48:38 305

原创 Ajax - 详解

xhr.open(methor, url, async, user, password)Method分别为 GET POST PUT DELETEGET 获取1、如果发送请求的地址和上次的地址相同时,会调用缓存,而不会去服务器请求2、在历史跳转后,回退时,get不会再次发送请求头3、get消息一般只做一次请请求,这次请求是做了一次请求头4、get发送请求时会将cookie也发送到服务器中(同域情况,跨域不能直接发送)5、发送请求时一般不会将数据传送到服务请中,但是有时候需要一些

2022-03-26 09:49:23 1354

原创 Node-基础

commonjs 的导出和导入方式导出module.exports=(导出的内容) 比如函数,对象,数组,变量等等导入var 变量名=require("./路径和文件名")导入时必须使用./(相对当前文件路径)开始 , 文件名不带扩展名!!导入多个模块var {o:o1,abc,arr}=require("./路径和文件名名");使用 ( : ) 起别名node自身也有一些api库,存储在node的安装文件中,当我们需要使用时,直接就可以调用了var http=req

2022-03-24 20:31:26 1158

原创 正则表达式 - Regular Expression

认识正则表达式 - Regular Expression目的:验证字符串是否符合规则是一个复杂数据类型 正则表达式的创建正则表达式的创建1、字面量方式创建语法:var reg = /内容/2、内置构造函数创建语法:var reg = new RegExp(’ 内容 ')...

2022-03-09 21:12:59 366

原创 ES6 - 模块化语法

模块化语法利用自己本身语法规则,在自己的文件内引入一个其他文件当需要按照模块化语法进行开发的时候(前提)当前页面的 script 标签需要有一个 type 属性,值设置为module只有这样,浏览器在解析该js语句的时候,才会按照模块化语法进行解析当前页面必须在服务器上打开,本地打开不能使用模块化语法模块化语法的规则当开始使用模块化语法的时候每一个js 文件都将会成为一个独立的js文件,互相之间没有任何联系和关系文件与文件之间相互不共通每一个独立文件叫做一个 文件作用域(模块作用

2022-03-08 08:37:44 739

原创 ES6 -箭头函数和解构赋值

ES6 语法 - 箭头函数ES6 语法中定义函数的一种方式,只能用来定义函数表达式(匿名函数)语法:() => {}() 书写形参的位置=> 箭头函数的标志{ } 函数的函数体箭头函数内的特点1、可以省略小括号不写只有当形参式一个参数的时候可以不写小括号。如果没有形参或者两个及以上的时候,必须书写小括号2、可以省略大括号不写当代码段内只有一句话(一个表达式)的时候,可以省略大括号不写并且会自动返回这句话的结果,自动把这句话的结果当作返回值3、没有argument

2022-03-08 08:13:06 772

原创 ES6-定义变量

ES6 语法 - 定义变量ES6 是官方阿紫2015年推出的一个ECMA Script语法版本定义变量的关键自-let 变量-const 常量let / const 和 var 的区别1、预解析var 会进行预解析let / const 不会,必须先定义后使用2、重复变量名var 可以定义重复变量名,重复定义没有意义let / const 不允许定义重复变量名3、块级作用域var 是没有块级作用域限制,只能被私有作用域限制使用方范围let / const 是可以被块级作用域限

2022-03-07 22:39:48 636

原创 JavaScript - this指向以及强行改变this指向

this 指向-官方:指当前代码执行的上下文环境(context)-私人:就是一个使用在作用域内(全局 / 函数内)的关键字全局作用域 this->在全局作用域内,this就是window(特指前端JS)函数作用域 this定义:不管函数在哪定义,不管函数怎么定义,只看函数的调用方式(箭头函数除外)1、普通调用-函数名()-函数内的 this 指向 window2、对象调用-对象名.函数名()-函数内的 this 指向 点( . )前面的全部内容3、事件处理函数-事件源.

2022-03-07 22:13:18 520

原创 JavaScript - 事件对象内的信息-鼠标键盘事件

事件对象内的信息鼠标事件坐标信息1、client事件对象.clientX事件对象.clientY鼠标光标相对于浏览器可视窗口左上角的坐标位置2、page事件对象.pageX事件对象.pageY鼠标光标相对于文档流左上角的坐标位置3、offset时间对象.offsetX时间对象.offsetY鼠标光标相对于 触发事件的元素 左上角的坐标位置鼠标光标相对于 事件目标 左上角的坐标位置键盘事件按下的是哪一个按键按下的是否是组合按键1、keyCode语法:事件对象.k

2022-03-05 19:47:58 136

原创 JavaScript - 事件2

事件目标当事件触发的时候,那个 准确触发事件的元素当给一个元素绑定事件以后:在该元素身上触发行为,是可以触发事件处理函数的在该元素的后代元素身上触发行为,也是可以触发事件处理函数的获取事件目标:标准浏览器:事件对象,targetIE 低版本:事件对象.sreElement注意:mouseenter 和 mouseleave事件传播概念:当用户在浏览器内触发指定行为的时候,会按照元素的 结构父级 向上传递该事件行为从事件目标开始,传递到window为止事件目标 > body &g

2022-03-05 15:53:38 61

原创 JavaScript - 事件绑定、解绑、对象

事件绑定在 JS 内有两种事件绑定方式1、DOM 0级 事件绑定-使用 on 语法进行绑定语法:事件源.on事件类型 = 事件处理函数特点:同一个事件源的同一个事件类型只能绑定一个事件处理函数2、DOM 2级 事件绑定(事件侦听器 / 事件监听器)标准浏览器语法:事件源.addEventListener(‘事件类型’,事件处理函数)特点:同一个事件源的同一个事件类型可以绑定多个事件处理函数,顺序绑定顺序执行IE 低版本语法:事件源.addEventListener(‘on事件类

2022-03-05 15:13:02 379

原创 JavaScript - 事件

认识事件指的是和浏览器内的某一个节点约定一个事情,当用户发生指定行为的时候,会执行指定的某一段代码事件三要素:1、事件源:绑定在谁身上的事件2、事件类型:绑定的什么事件3、事件处理函数:当行为发生的时候,执行的函数-定义:在事件处理函数内,this 关键字就是 事件源注意:所有的事件类型,都是只要有行为发生,事件处理函数的绑定就会触发函数注意:键盘事件所有元素都可以绑定,但是不是所有元素都能触发(一般绑定给window,document,表单元素)注意:表单事件,不一定非得有 form 标

2022-03-05 14:15:12 153

原创 JavaScript - 节点

节点操作对于页面上标签的操作获取节点第一类: 获取元素节点=> 获取非常规元素节点-> html: document.documentElement-> head: document.head-> body: document.body=> 获取常规元素节点-> document.getElementById()-> document.getElementsByClassName()-> document.getElementsByTag

2022-03-05 11:05:35 145

原创 JavaScript - 获取元素、可视窗口尺寸和元素偏移量

获取元素尺寸(占地面积)语法第一套:-元素.offsetWidth获取的是元素 内容 + padding + border 区域的宽度-元素.offsetHeight获取的是元素 内容 + padding + border 区域的高度注意:不管盒子模型内容是什么,区域不变语法第二套:-元素.clientWidth获取的是元素 内容 + padding 区域的宽度-元素.clientHeight获取的是元素 内容 + padding 区域的高度注意:不管盒子模型是什么,区域不

2022-03-05 09:37:59 399

原创 JavaScript - 操作元素属性、样式、类名

DOM - Document Object Model一整套操作文档流的属性和方法操作页面的标签(元素)操作标签的增删改查操作标签的属性(id, class, type, …)操作标签的样式…认识一些内容-document:文档流,页面,根节点,但不是元素(标签)-html:承载所有标签的最大的元素,根元素节点-head:专门承载当前页面的说明标签,这里的内容一般不显示在页面上-body:专门承载当前页面的显示标签,真实显示在网页的内容获取元素用一个变量保存页面中的某个

2022-03-04 21:25:40 913

原创 JavaScript - BOM和常用操作

BOM - Browser Object Model 浏览器对象模型提供了一整套操作浏览器相关内容的属性和方法特点操作的都是和浏览器这个软件本身相关的内容(滚动条,地址栏,标签页,弹窗,…)所有的BOM相关操作,在各个浏览器表现形式不一样BOM操作一般都是window.xxx,书写的时候可以省略window不写浏览器可视窗口大小语法:window.innerWidthwindow.innerHeight注意:获取的是包含滚动条在内的尺寸( Mac 除外)浏览器的弹出层提示框

2022-03-03 22:56:19 80

原创 JavaScript - 选择排序

选择排序逻辑:1. 遍历数组, 找到数组中最小的数字, 和最前面一个数字对调2. 从第二轮开始, 跳过第一个, 剩下的再继续重复步骤1 第 x 轮 外层循环控制变量 假设 里层循环开始 对调 1 0 0 1 [0] 和 [minIndex] 2 1 1 2

2022-03-03 17:10:44 188

原创 JavaScript - 计数排序

计数排序逻辑:1. 准备一个新的数组=> 遍历原始数组, 把原始数字当做新数组的索引向新数组内填充数据=> 新数组的数据按照计数排列2. 遍历新数组=> 把索引在当做数据放进原始数组内=> 前提: 把原始数组清空 // 计数排序 var origin = [ 9, 3, 100, 6, 4, 100, 1, 9, 8, 7, 2, 2, 5, 100, 3, 32, 55 ] var newarr = [] // 1. 把数据当索引

2022-03-03 17:06:54 153

原创 JavaScript - 时间对象和常用方法

时间对象 - Date一个 js 内的数据类型,是一个复杂数据类型在前端 js 内,获取到的是当前前端的时间(包含时区)创建时间对象-内置构造函数方式创建-创建当前时间的时间对象语法:var time = new Date()-创建指定时间节点的时间对象需要传递参数1、传递一个数字这个数字表示毫秒数相当于从 格林威治时间(1970年1月1日0点0分0秒)向后退进2、传递两个及以上数字-> 第一个数字表示 年-> 第二个数字表示 月 (0 表示 1 月, 11 表示

2022-03-03 08:52:17 279

原创 JavaScript - 数学方法

数学方法所有的数学方法都是Math.xxx()1、random()语法:Math.random()返回值:[0, 1)的随机浮点数,有可能为 0 但是绝对不可能为12、round()语法:Math.round(数字)返回值:四舍五入取整后的结果3、ceil()语法:Math.ceil(数字)返回值:向上取整后的结果4、floor()语法:Math.floor(数字)返回值:向下取整后的结果5、abs()语法:Math.abs(数字)返回值:该数字的绝对值6、sqr

2022-03-03 08:36:47 600

原创 JavaScript -字符串常用方法

字符串常用方法-都是操作字符串的方法-通用语法:字符串.XXX()-注意:所有字符串方法都不会改变原始字符串,而是以返回值给出结果1、 charAt()语法:字符串.charAt(索引)返回值:该索引位置的字符注意:当没有索引位置的时候,返回值是一个 空字符串(’’)2、charcodeAt()语法:字符串.charCodeAt(索引)返回值:该索引位置的字符的编码(unicode)注意:返回值是一个 Number 类型,如果没有该索引位置,返回NaN3、toUpperCase(

2022-03-03 08:04:18 510 1

原创 JavaScript - 快速排序

快速排序(递归二分法) // 代码实现 function quickSort(arr) { // arr 就是要排序的数组 // 1. 先写停 if (arr.length <= 1) return arr // 2. 按照递进书写 // 2-1. 从 arr 的中间拿出一个数字来, 截取(splice) var centerIndex = parseInt(arr.length / 2) //

2022-03-02 22:34:07 87

原创 JavaScript - 插入排序的两种方式

插入排序1新建一个新数组循环遍历原始数据,把原始数组内的每一个逐个插入到新数组内在插入的时候,按照一定的顺序插入 // 原始数组 var arr = [ 9, 2, 5, 3, 7, 6, 4, 1, 8 ] // 准备一个新数组 var newarr = [] // 循环遍历原始数组 for (var i = 0; i < arr.length; i++) { // arr[i] 就是原始数组中的每一个数据, 也就是要插入新数组的

2022-03-02 22:17:18 2273

原创 JavaScript - map 和 filter

数组常用方法 - map语法:数组.map{ function (item, index, arr) {}}作用:对原始数组进行映射返回值:就是一个和原始数组一样长度的新数组,并且内部的数据是被映射操作过的内容 var arr = [ 10, 20, 30, 40 ] var res = arr.map(function (item) { return item * 10 }) console.log(arr) console.log(res)数组常用方法 - f

2022-03-02 21:32:35 116

原创 JavaScript - forEach

数组常用方法-forEach()-专门用来遍历数组的方法语法数组.forEach(function (item, index, arr){// item 表示数组的每一项// index 表示数组每一项的索引// arr 表示原始数组})返回值-没有,undefined var arr = [ 100, 200, 300, 400, 500, 600 ] var arr2 = [ 10, 20, 30, 40 ] // a 会根据数组内有多少数据, 执行多少回

2022-03-02 21:15:49 109

原创 JavaScript - 数组去重的六种方法

数组去重:1. 双层循环:for (var i = 0; i < arr.length; i++) { for (var j = i + 1; j < arr.length; j++) { if (arr[i] === arr[j]) { arr.splice(j, 1) i-- } }}2. 先排序,再删除:arr.sort()for (var i = 0; i < arr.length - 1; i++) { i

2022-03-01 20:00:56 108

原创 JavaScript - 数组常用方法02

数组常用方法flat():语法:1、 数组.flat(数字)如果不传递参数默认拆开一层传递的数字是几,就拆开多少层不管多少维度都能拆开,Infinity作用:拆分数组(把多维度转换成一维)find() :语法:1、 数组.find( function (item, index, arr) {})返回值:数组中满足条件的第一个以return的形式书写条件findIndex() :语法:1、 数组.find Index( function (item, index, arr

2022-02-28 20:11:38 226

原创 JavaScript - 数组常用方法01

数组常用方法什么是数组常用方法Js提供给我们专门用来操作数组的方法由于数组本身的特性决定了,好加不好去,不好插入语法特点:数组.方法名(参数)不同的方法,就是方法名和参数不一样1. push():语法:1、 数组.push(数据)2、 数组.push(数据,数据2,…)作用:按照顺序向数组的后面追加插入的数据返回值:追加数据以后,数组最新的长度2. pop():语法:1、 数组.pop()作用:删除数组的最后一个数据返回值:被删除的数据3. unshift():

2022-02-28 17:47:49 154

原创 JavaScript - 数组和数组的基本操作

认识数组数据类型 - Array- 是一个 js 内的数据类型,是一个复杂数据类型。也是一个‘盒子’。用来存储数据的盒子- 数组内存储的数据是按照‘序号’排列的,有序的数据集合- 序号:叫做 索引 或者 下标,从0开始,依次+1创建数组数据类型1. 字面量方式创建- 创建空数组: var arr = []- 创建一个带有数据的数组:var arr = [数据1, 数据2,...]2. 内置构造函数方式创建- 创建空数组:var arr = new Array()-

2022-02-27 19:36:52 321

原创 CSS盒子模型 - 弹性盒模型

弹性元素- display:flex- 可以将写了display:flex的元素叫做弹性父元素,它的直系子元素叫做弹性子元素默认弹性情况- 当元素开启弹性布局后,浏览器会出现一些默认弹性情况1. 生成一条主轴- 主轴方向从左到右2. 生成一条侧轴- 侧轴方向从上到下- 侧轴永远垂直于主轴3. 弹性子元素在主轴的排序方式- 默认从主轴开始方向向结束方向排列4. 尺寸问题- 当弹性子元素不设置宽高的时候- 主轴方向的尺寸默认是元素内...

2022-02-27 15:10:00 195

原创 JavaScript - 深浅拷贝

深浅拷贝- 复制数据的方式- 一般指的就是复制对象或者数组1. 赋值- 赋值以后,两个变量操作一个对象空间2.浅拷贝- 把的对象内的每一个数据复制一份- 新对象进行修改时被复制的对象不受影响- 只能拷贝一层数据,多维度数据不好使扩展:- 一个运算符,展开运算符(...) - 直接在一个对象内书写 ...对象名3. 深拷贝- 把对象内的每一个数据复制一份,不管多少层维度都进行百分之百赋值- 两个对象完全没有任何关系- 利...

2022-02-26 10:13:39 115

原创 JavaScript - 认识对象数据类型及基本操作

认识对象数据类型 - object- 是 js 中的一个数据类型,是一个复杂数据类型- 是一个 ‘ 盒子’,承载的是 数据- 是一个无序的数据集合,也是一个键(key)值(value)对的集合

2022-02-26 09:23:06 195

原创 JavaScript - 递归函数

递归函数(慎用)- 在一个函数内,自己调用自己- 逐层递进的过程,逐层回归的过程递归函数书写- 先写折返点- 按照规则书写递进过程,不要忘记写returneg: 求一个数的阶乘function fn(n) { // 折返点 if (n === 1) return 1 res = n * fn(n - 1) // 递进过程 return res } fn(4) console.log(res)递归书写辗转相除最大公约数

2022-02-25 21:45:10 63

原创 JavaScript - 函数内的预解析

1. 函数定义阶段1. 在 堆内存 中开辟一段储存空间2. 把函数体内的代码当做 字符串 放在开辟出来的存储空间内3. 把函数名放在 栈内存 中,把堆内存中的空间地址赋值给 栈内存的变量2. 函数调用阶段1. 按照 栈内存 中变量存储的地址找到函数的存储空间- 如果这个空间不是一个函数存储空间,那么直接报错 xxx is not a function2. 在 调用栈 中开辟一段新的 函数执行空间- 把函数存储空间内的形参、代码全部复制过来...

2022-02-25 21:38:44 129

原创 JavaScript - 预解析

预解析:- 在所有代码开始执行之前,对代码进行通读并解释,解释完毕以后再开始执行代码- 函数调用问题- 在函数定义的时候,被装进“盒子”内的代码是不执行的- 在函数调用的时候,代码才会执行- 与解析有两部分- 全局预解析:打开页面的时候,回怼全局代码进行预解析,但是函数体内的代码不管 - 局部预解析:当函数调用的时候,会在函数的私有作用域内进行预解析,解析完毕执行函数 体内的代码预解析解释哪些内容:- var...

2022-02-25 21:11:23 130

原创 JavaScript - 认识作用域及变量的三种形态

​1. 作用域- 变量(变量/函数名)的生效使用范围2. 作用域的分类- 全局作用域(window):一个 html 页面打开就是一个全局作用域- 私有作用域:⚠️只有函数生成私有作用域⚠️ - 只要书写了一个函数,就会生成一个私有作用域 - 一旦书写,就会一直生效- 书写在哪一个作用域内的函数,就是哪一个作用域的子级作用域3. 变量的三种机制1. 变量定义机制- 定义在哪一个作用域下的变量,就是哪一个作用域的私有变量- 只能在

2022-02-25 20:44:17 146

原创 JavaScript基础 - 函数的 return

1.函数的 return- 作用1. 给函数添加一个返回值2. 打断函数:书写在return后面行的代码不会继续执行- 函数的返回值- 在函数以内return关键字确定该函数的结果- return 数据- 函数的问题- fn 和 fn()分别代表什么意思?- fn 就是一个变量名,存储的是该函数的‘地址’,书写这句代码的时候不会执行函数内的代码 - fn() 表示把 fn 这个函数内的代码从上到下的执行...

2022-02-24 20:28:57 306

原创 JavaScript基础 - arguments 遍历

1.arguments是一个在函数内使用的变量- 是函数自带的变量-是一个数据集合- 承载的就是该函数被调用时传递的所有 实参- 函数实参的集合2. arguments的基本操作1. length 属性- 语法:arguments.length- 表示该数据集合内有多少个数据,也就是传递了多少个实参- 会得到一个数值类型 (Number)2. 索引属性- arguments 内的数据是按照顺序依次排列的- arguments 内的每一个数据...

2022-02-24 20:16:44 1133

原创 JavaScript基础 - 函数的参数

在函数内,参数有两种1. 形参- 书写在函数定义阶段的 ( ) 内,这是一个只能在函数内部使用的变量 (a, b)- 可以书写多个,书写多个的时候中间使用 逗号 分隔function fn(a, b) {}- 参数的值由函数调用时传递的实参决定2. 实参- 书写在函数调用阶段的 ( ) 内,就是按照顺序依次给形参进行赋值的数据- 可以书写多个,书写多个的时候中间使用 逗号 分隔fn(100, 200)注意⚠️:当调用时没有传递实参,没有数据给形参a和b赋值

2022-02-24 19:47:55 78

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除