JavaScirpt
文章平均质量分 73
阿牛大牛中
总得有盼头,好过每天都犯愁。
展开
-
promise的使用
文章目录使用 Promise约定链式调用Catch 的后续链式操作错误传递Promise 拒绝事件在旧式回调 API 中创建 Promise组合时序嵌套常见错误使用 PromisePromise 是一个对象,它代表了一个异步操作的最终完成或者失败。因为大多数人仅仅是使用已创建的 Promise 实例对象,所以首先说明怎样使用 Promise,再说明如何创建 Promise。本质上 Promise 是一个函数返回的对象,我们可以在它上面绑定回调函数,这样我们就不需要在一开始把回调函数作为参数传入这个函数原创 2021-08-14 15:40:02 · 192 阅读 · 0 评论 -
ES6、ES7、ES8、ES9、ES10新特性
原创 2021-08-09 18:06:48 · 194 阅读 · 0 评论 -
了解防抖debounce函数与节流throttle函数
文章目录作用防抖函数节流函数比较作用优化高频率执行js代码的一种手段,js中的一些事件如浏览器的resize、scroll,鼠标的mousemove、mouseover,input输入框的keypress等事件在触发时,会不断地调用绑定在事件上的回调函数,极大地浪费资源,降低前端性能。为了优化体验,需要对这类事件进行调用次数的限制。防抖函数在事件被触发n秒后再执行回调,如果在这n秒内又被触发,则重新计时。对于函数防抖,有以下几种应用场景:给按钮加函数防抖防止表单多次提交。对于输入框连原创 2021-02-12 11:02:45 · 1640 阅读 · 6 评论 -
JavaScript事件循环
文章目录运行时概念可视化描述栈堆队列事件循环执行至完成添加消息零延迟多个运行时互相通信运行时概念可视化描述栈函数调用形成了一个由若干帧组成的栈。function foo(b) { let a = 10; return a + b + 11;}function bar(x) { let y = 3; return foo(x * y);}console.log(bar(7)); // 返回 42当调用 bar 时,第一个帧被创建并压入栈中,帧中包含了 bar原创 2021-02-12 10:14:22 · 107 阅读 · 0 评论 -
js绘图
文章目录JavaScript绘图使用canvas绘制图形矩形路径圆弧直线与曲线定义样式和颜色颜色不透明度实线虚线经向渐变图案阴影填充规则图形变形保存和恢复状态清除画布移动坐标旋转坐标缩放图形变换图形图形合成合成裁切绘制文本填充文字轮廓文字文本样式测量宽度导入图像缩放图像裁切图像平铺图像JavaScript绘图HTML5新增了Canvas API,允许js在<canvas>标签识别的画布上绘制图形,创建动画,设置设计实时视频处理或渲染。借助一套编程接口,用户可以在页面上绘制出任何漂亮的图形。原创 2020-10-26 10:44:55 · 13927 阅读 · 7 评论 -
js文件操作
文章目录JavaScript文件操作访问文件域使用Blob对象访问Blob创建Blob截取Blob保存Blob使用FileReader对象读取文件事件监测使用缓存对象使用ArrayBuffer使用ArrayBufferView使用DataView使用FileSystem API访问FileSystem创建文件写入数据添加数据读取数据复制文件删除文件JavaScript文件操作HTML5新增FileReader API和FileSystem API。其中FileReader API负责读取文件内容,Fil原创 2020-10-23 08:13:34 · 5672 阅读 · 0 评论 -
js之脚本化CSS
文章目录脚本化CSSCSS脚本化基础读写行内样式使用style对象使用styleSheets对象使用selectorText对象编译样式添加样式读取显示样式使用CSS事件设计大小使用offsetWidth和offsetHeight使用scrollLeft和scrollTop获取元素大小获取窗口大小设计位置使用offsetLeft和offsetTop使用offsetParent获取指针的页面设置获取滚动条位置设置滚动条位置设计显隐显示和隐藏半透明显示设计动画移动动画渐隐渐显脚本化CSS脚本化CSS就是使用原创 2020-10-09 13:25:31 · 370 阅读 · 0 评论 -
JS事件处理这一篇就够了!!
文章目录事件处理事件基础事件流绑定事件事件处理函数注册事件销毁事件使用event对象事件委托使用鼠标事件鼠标点击鼠标移动鼠标经过鼠标来源鼠标定位鼠标按键使用键盘事件键盘事件属性键盘响应顺序使用页面事件页面初始化结构初始化页面卸载窗口重置页面滚动错误处理使用UI事件焦点处理选择文本字符值变化检测提交表单重置表单事件处理早期互联网访问速度是非常慢的,为了避免用户漫长的等待,开发人员尝试把服务器端需要处理的任务部分前移到客户端,让客户端js脚本代替解决,如表单信息验证等。于是在IE3.0和Netscape2.原创 2020-10-05 08:19:19 · 687 阅读 · 1 评论 -
js之DOM操作
文章目录DOM操作节点概述节点类型节点名称和值节点关系访问节点操作节点文档节点访问文档访问子节点访问特殊元素访问元素集合访问文档信息访问文档元素元素节点访问元素创建元素复制节点插入节点删除节点替换节点文本节点创建文本节点访问文本节点读取HTML字符串插入HTML字符串替换HTML字符串读写文本属性节点创建属性节点读取属性节点设置属性值删除属性使用类选择器自定义属性文档片段节点CSS选择器DOM操作DOM(Document Object Modle,文档对象模型)是W3C定制的一套技术规范,用来描述js脚原创 2020-09-22 19:11:11 · 704 阅读 · 0 评论 -
js——BOM操作知多少?
文章目录BOM操作window对象全局作用域访问客户端对象使用系统对话框打开和关闭窗口使用定时器控制窗口大小和位置navigator对象浏览器检测方法检测浏览器类型和版本号检测操作系统Location对象history对象操作历史记录screen对象动态生成文档内容BOM操作浏览器对象模型(Browser Object Model, BOM)被广泛应用于Web开发之中,主要用于客户浏览器的管理。BOM概念比较古老,但是一直没有被标准化,不过主流浏览器均支持BOM,都遵循最基本的规则和用法,W3C也将BO原创 2020-09-20 07:26:09 · 273 阅读 · 0 评论 -
js构造函数、原型与继承深入
文章目录构造函数、原型、继承构造函数定义构造函数调用构造函数构造函数的返回值引用构造函数this指针this安全策略绑定函数使用bind链式语法原型定义原型访问原型设置原型检测原型原型属性和私有属性应用原型原型链原型继承扩展原型方法类型构造原型动态原型工厂模式类继承构造函数、原型、继承js是基于对象,但不完全面向对象的编程语言。在面向对象的编程模式中,有两个核心概念:对象和类。在ECMAScript6规范之前,js没有类的概念,仅允许通过构造函数来模拟类,通过原型实现继承。【学习重点】理解构造函数原创 2020-09-18 07:52:46 · 274 阅读 · 0 评论 -
js使用对象要点回溯
文章目录使用对象定义对象构造对象对象直接量使用Object.create操作对象引用对象复制对象克隆对象摧毁对象操作属性定义属性删除属性使用方法对象与数组属性描述对象属性描述对象的结构访问器操作属性描述对象控制对象状态Object原型方法使用toString()使用valueOf()检测私有属性Object静态函数对象包装函数对象构造函数静态函数使用对象在js中,对象是一个泛化概念,任何值都可以转换成对象,以对象的方式使用,如数字对象、布尔值对象、字符串对象、类型对象、函数对象、数组对象等,他们都继承O原创 2020-09-14 15:49:55 · 194 阅读 · 0 评论 -
js函数使用详细讲解!
文章目录使用函数定义函数声明函数构造函数函数直接量定义嵌套函数调用函数函数调用函数的返回值方法调用使用call和apply调用使用new调用函数参数形参和实参获取参数个数使用arguments对象使用callee应用arguments对象函数作用域词法作用域执行上下文和活动对象1. 全局上下文的变量对象2. 函数上下文的变量对象作用域链this和调用对象比较3种函数的作用域函数标识符闭包闭包定义1.形成原理2.闭包结构3.闭包变体使用闭包闭包的局限性函数式运算函数合成函数柯里化高阶函数回调函数单例模式实现A原创 2020-09-13 21:35:27 · 1967 阅读 · 0 评论 -
js数组灵活运用必备知识!!
文章目录关于数组数组迭代使用for迭代使用forEach迭代使用keys迭代操作数组栈操作队列操作删除元素添加元素截取数组数组排序数组转换元素定位检测数组遍历元素检测映射数组数组过滤数组汇总关于数组数组迭代使用for迭代for和for/in语句都可以迭代数组。for语句需要配合length属性和数组的下标来实现,执行效率没有for/in语句高。另外,for/in语句会跳过空元素。提示:对于超长数组来说,建议使用for/in语句会跳过空元素。实例1:var a = [1, 2, , , ,原创 2020-09-09 18:54:56 · 320 阅读 · 0 评论 -
js关于数据类型检测与转换你是否了解???
文章目录基本类型类型检测使用constructor使用toString()重写toString()方法设计思路类型转换转换为字符串转换为数字模式字符串转换为小数格式字符串转换为数字转换为布尔值转换为对象基本类型众所周知,js定义了6中基本数据类型,如下表:数据类型说明null空值,表示非对象undifined未定义的值,表示未赋值的初始化值number数字,数学运算的值string字符串,表示信息流boolean布尔值,逻辑运算符obje原创 2020-09-06 09:55:57 · 125 阅读 · 0 评论 -
js如何减少变量污染?
文章目录关于变量变量提升变量作用域变量污染关于变量在js中使用var语句声明变量。在非严格模式下,js允许不声明变量就直接为其赋值,这是应为js解释器能够自动隐式声明变量。隐式声明的变量中是作为全局变量使用。在严格模式下,变量必须先声明,然后才能使用。变量提升js在预编译期会先预处理声明的变量,但是变量的赋值操作发生在js执行期,而不是预编译期。实例:document.write(a);//显示undifineda = 1;document.write(a);//显原创 2020-09-05 10:27:18 · 412 阅读 · 0 评论 -
写了这么久js,你知道js代码是在什么时候执行的么?
文章目录关于执行js程序延迟执行js文件异步加载js文件js代码块关于执行js程序浏览器在解析HTML文档时,将根据文档流从上到下逐行解析和显示。Javascript代码也是HTML文档的组成部分,因此Javascript脚本的执行顺序也是根据<script>标签位置来确定的。提示:对于导入的js文件,也将按照<script>标签在文档中出现的顺序来执行,而执行过程是文档解析的一部分,不会单独解析或者延期执行。注意:一般情况下,在文档<head>标签中包含j原创 2020-09-05 08:48:48 · 3139 阅读 · 0 评论 -
JS高级(4)——线程机制与事件机制
文章目录线程机制与事件机制进程与线程浏览器内核定时器引发的思考JS是单线程执行的浏览器的事件循环(轮询)模型相关重要概念H5 Web Workers(多线程)线程机制与事件机制进程与线程进程(process)程序的一次执行,它占有一片独有的内存空间。可以通过任务管理器查看线程(thread)进程内的一个独立执行单元是程序执行的一个完整流程是CPU最小的调度单元相关知识应用程序必须运行在某个进程的某个线程上。一个进程中至少有一个运行的线程:主线程,进程启动后自动创建。原创 2020-06-23 09:52:19 · 208 阅读 · 0 评论 -
JS高级(3)——对象高级
文章目录对象高级对象创建模式Object构造函数模式对象字面量工厂模式自定义构造函数模式构造函数+原型的组合模式继承模式原型链继承借用构造函数继承(假的)组合继承对象高级对象创建模式Object构造函数模式套路:先创建空Object对象,再动态添加属性/方法。适用场景:起始时不确定对象内部数据。问题:语句太多。<script type="text/javascript"> /* *一个人:name:"Tom",age:12 */ var p原创 2020-06-23 09:51:25 · 173 阅读 · 0 评论 -
JS高级(2)——函数高级
文章目录函数高级原型与原型链原型链执行上下文与执行上下文栈执行上下文执行山下文栈作用域与作用域链作用域与执行上下文关系作用域链闭包函数高级原型与原型链原型(prototype)函数的prototype属性每个函数都有一个prototype属性,它默认指向一个Object空对象(即称为:原型对象)原型对象中有一个属性constructor,它指向函数对象。给原型对象添加属性(一般都是方法)作用:函数的所有实例对象自动拥有原型中的属性(方法)显式原型与隐式原型每个函原创 2020-06-23 09:50:43 · 182 阅读 · 0 评论 -
JS高级(1)——数据、变量与内存
文章目录数据-变量-内存什么是数据?什么是内存?什么是变量?内存-数据-变量三者之间的关系相关问题对象函数回调函数IIFE(匿名函数)函数中的this补充分号问题数据-变量-内存什么是数据?存储在内存中代表特定信息的东西,本质上是0101…数据的特点:可传递,可运算。一切皆数据。内存中所有的操作目标:数据。(算术运算、逻辑运算、赋值、运行函数)什么是内存?内存条通电以后产生的可存储数据的空间(临时的)内存产生和死亡:内存条(电路板)==> 通电 ==> 产生内存空间 ==>原创 2020-06-23 09:49:20 · 162 阅读 · 0 评论 -
【JS-14】——BOM浏览器对象模型
BOM和DOM就一字母之差,指的是浏览器对象模型。BOM可以使我们通过JS来操作浏览器,在BOM中为我们提供了一组对象,用来完成对浏览器的操作。这些BOM对象在刘拉你中都是window的属性保存的,可以通过window对象来使用,也可以直接使用。文章目录WindowWindow 对象属性Window 对象方法NavigatorNavigator 对象属性Navigator 对象方法LocationLocation 对象属性Location 对象方法HistoryHistory 对象属性History 对象原创 2020-05-11 09:14:44 · 215 阅读 · 0 评论 -
【JS-13】——JavaScript通过JS修改样式
目前为止,我们的dom一直都在操控html标签,也就是结构,但是还没开始操纵样式呢,接下来我们说一下使用dom操纵css。文章目录通过JS修改元素样式通过JS读取样式其他样式操作的属性鼠标移入坐标练习事件的传播之前的通过JS修改元素样式语法:元素.style.样式名 = 样式值注意样式值是字符串。<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></tit原创 2020-05-09 18:18:43 · 966 阅读 · 0 评论 -
Javascript——dom小练习:员工增删表格
学了这些关于dom的属性以及方法,我们来做一个小练习,巩固一下知识:练习就是制作一个能添加和删除员工信息的表。大致是这样的,在最后会给出完整的代码。好了我们开始练习:空白无行为表由于主要是练习我们Javascript,我们给出HTML和CSS的样式表,样式表还没有任何功能:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>增删改练习</title&原创 2020-05-09 18:13:54 · 836 阅读 · 0 评论 -
【JS-12】——DOM相关
文章目录获取元素节点读取元素信息自制相册练习获取元素节点的子节点获取父节点和兄弟节点全选练习dom查询的其他方法CSS选择器dom增删改之前的获取元素节点通过document对象调用getElemetById()通过id属性获取一个元素节点对象。getElementsByTagName()通过标签名获取一组元素节点对象。getElementsByTagName()可以根据标签名来获取一组元素节点对象,这个方法会给我们发挥一个类数组对象,我们所查询到的元素都会封装到对象中,即使查询到的对象只有一个原创 2020-05-09 18:11:48 · 215 阅读 · 0 评论 -
【JS-11】——DOM事件简介
好了目前内建对象基本过了一遍,接下来我们学习宿主对象,由浏览器提供的(DOM、BOM)先来DOM(Document Object Model)文档对象模型。文章目录DOM基础节点DOM基本操作事件的简介处理事件鼠标事件键盘事件框架/对象(Frame/Object)事件表单事件剪贴板事件打印事件拖动事件多媒体(Media)事件动画事件过渡事件其他事件文档加载之前的DOM基础什么是DOM,全称...原创 2020-05-03 23:12:17 · 266 阅读 · 0 评论 -
【JS-10】——JavaScript正则表达式
好了我们开始说正则表达式。正则表达式也称规则表达式(Regular Expression),是操作字符串的一种逻辑公式,就是用事先规定的一些字符以及这些特定字符的组合,组成一个”规则字符串“,这个规则字符串用来表达对字符串的一种匹配模式。文章目录正则表达式对象正则表达式语法量词元字符支持正则表达式的 String 对象的方法电子邮件的正则练习数字相关的正则表达式字符相关的正则表达式固定格式约定俗...原创 2020-05-02 16:47:27 · 462 阅读 · 0 评论 -
【JS-9】——JavaScript包装类
说正则表达之前,我们再来补充一下包装类的相关对象文章目录包装类String()Number()Boolean()之前的包装类我们之前说过,数据类型分为基本数据类型(String、Number、Boolean、Null、Undefined)和引用数据类型(Object)。在JS中为我们提供了三个包装类,通过这三个包装类,可以将基本数据类型的数据转换为对象。String()String(...原创 2020-05-02 11:25:52 · 138 阅读 · 0 评论 -
【JS-8】——javaScript中Date与Math对象
前两节我们说了函数和数组,还有一些知识点没有说完全,这次我们来补充一下。文章目录函数的方法arguments对象Date对象Date对象方法Math对象之前的函数的方法现在我们来补充一下函数的两个方法call(),apply(),当对函数调用call()或apply()都会调用函数执行。fun.call();fun.apply();fun();在调用call()和apply()可以...原创 2020-05-02 08:34:10 · 176 阅读 · 0 评论 -
【JS-7】——JavaScript数组的使用
我们之前说对象的时候,分成了三种:内建对象,宿主对象,自定义对象。接下来我们要学习内奸对象和宿主对象。我们就来说一下数组文章目录创建数组数组的方法push()pop()unshift()shift()silce()splice()其他方法数组的遍历之前的创建数组先看个数组属性的表格:属性描述constructor返回创建数组对象的原型函数。length设置或返...原创 2020-05-01 19:58:48 · 274 阅读 · 0 评论 -
【JS-6】——JavaScript构造函数与原型
上次笔记大致说了一下javaScript中函数的使用,我们这次来看一下构造函数与原型。文章目录使用工厂方法创建对象构造函数构造函数的执行流程使用toString()构造函数的修改原型检测原型之前的使用工厂方法创建对象我们现在要创建几个对象:var obj ={ name:"孙悟空", age:18, gender:male, sayName:function(){ a...原创 2020-05-01 11:16:32 · 240 阅读 · 0 评论 -
【JS-5】——javascript关于函数的使用
文章目录函数定义一个函数构造函数函数声明函数表达式函数的参数函数的返回方法枚举对象中的属性 变量提升函数提升函数的作用域全局作用域:局部作用域:this和调用对象之前的函数函数也是一个对象,函数可以封装一些功能(代码),在需要时可以执行这些功能(代码)。定义一个函数构造函数换句话说,函数中可以保存一些代码,在需要的时候调用创建一个函数对象:var fun = new Functi...原创 2020-05-01 00:05:11 · 590 阅读 · 0 评论 -
【JS-4】——JavaScript关于对象的使用
文章目录对象的简介对象的基本操作属性名和属性值基本数据类型和引用数据类型对象字面量之前的对象的简介我们前面说了JS的数据类型有6种:String 字符串Number 数值Boolean 布尔值Null 空值Undefined 未定义以上这五种类型属于基本数据类型,以后我们看到的值,只要不是上面的五种,全都是对象。Object 对象基本数据类型都是单一...原创 2020-04-30 11:14:05 · 219 阅读 · 0 评论 -
【JS-3】——JavaScript流程控制语句
我们来说一下JavaScript的语句。文章目录流程控制语句条件判断语句条件分支语句循环语句之前的我们的程序是由一条一条语句构成的,语句是按照自上向下的顺序一条一条执行的。在JS中可以使用{}来为语句进行分组,同一个{}中的语句我们称为一组语句,他们要么都执行,要么都不执行,一个{}中的语句我们也称为一个代码块。在代码块的后面就不用再编写分号了。JS中的代码块,只具有分组的作用,没有其...原创 2020-04-30 11:09:29 · 275 阅读 · 0 评论 -
【JS-2】—— JavaScript运算符与表达式
上次的笔记主要说了一些JavaScript基本信息和基本数据类型,这次我们来说下运算符和表达式。文章目录运算符算数运算符自增(++)和自减(--)逻辑运算符赋值运算符关系运算符条件运算符运算符的优先级表达式表达式的形式表达式的类型表达式的运算顺序表达式的优化之前的运算符运算符也叫操作符,通过运算符可以对一个或多个值进行运算,并获得运算结果。比如:typeof就是运算符,可以获得一个值的类型...原创 2020-04-29 15:00:11 · 504 阅读 · 2 评论