
JavaScript--基础
文章平均质量分 88
muzidigbig
凡事第一反应,找方法,而不是找借口;发现问题,反思,而不是急着辩解。
展开
-
load、unload和pagehide、pageshow
load 页面第一次加载时触发,前进或后退使用缓存不会触发pageshow 页面每次展示都会触发,前进或后退使用缓存会触发pageshow 包含 load触发时机:load先触发,pageshow后触发。pagehide先触发,unload后触发。原创 2023-08-04 09:58:56 · 1296 阅读 · 0 评论 -
浏览器渲染机制;重绘 重排
1.处理HTML并构建DOM树。2.处理CSS构建CSSOM树。3.将DOM与CSSOM合并成一个Render渲染树。4.根据渲染树来布局,计算每个节点的位置(会发生重绘或重排)。5.调用GPU绘制,合成图层,显示在屏幕上。Load 和 DOMContentLoaded 区别css哪些属性可以继承原创 2023-03-07 11:28:54 · 454 阅读 · 0 评论 -
js对url进行编码解码(三种方式)
js对url进行编码解码原创 2022-11-08 15:02:22 · 17110 阅读 · 2 评论 -
js---浅拷贝与深拷贝
数据分为基本数据类型(String, Number, Boolean, Null, Undefined,Symbol)和引用数据类型。基本数据类型的特点:直接存储在栈(stack)中的数据引用数据类型的特点:存储的是该对象在栈中引用,真实的数据存放在堆内存里浅拷贝与深拷贝是只针对Object和Array这样的引用数据类型JSON.parse(JSON.stringify()) 弊端递归实现深拷贝原创 2021-12-09 16:07:26 · 669 阅读 · 0 评论 -
js---异常处理、throw、Error、try...catch
【前言】本文主要介绍下JS的Error name相关属性.当 JS 引擎执行 JS代码时,会发生各种错误。①语法错误,通常是程序员造成的编码错误或错别字;②拼写错误或语言中缺少的功能(可能由于浏览器差异);③来自服务器或用户的错误输出而导致的错误;④由于许多其他不可预知的因素;当发生错误时,JS通常会停止并产生错误消息。技术术语是这样描述的:JavaScript 将抛出异常(抛出错误)。JS实际上会创建一个Error对象,该对象带有两个属性name和message。【概念】 erro原创 2021-08-27 18:31:45 · 5722 阅读 · 1 评论 -
js---设计模式
1.单例模式在面向对象语言中,调用一个类的方法之前,必须先将这个类实例化,才能调用类方法。单例就是保证一个类只有一个实例,实现的方法一般是先判断实例存在与否,如果存在直接返回,如果不存在就创建了再返回,这就确保了一个类只有一个实例对象。单例模式能使得我们不需要每次都需要实例化一次,因为我们使用的对象都是同一个对象。单例模式:只允许实例化一次的对象类。注意:1、单例类只能有一个实例。2、单例类必须自己创建自己的唯一实例。...原创 2020-10-30 16:23:37 · 349 阅读 · 2 评论 -
js--JSON序列化(三个参数的使用)和反序列化
即js中的对象转化为字符串。toJSONString()JSON.stringify(obj)parseJSON()parse()原创 2018-10-23 13:24:58 · 8148 阅读 · 1 评论 -
js中的reduce()函数
定义:reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。对空数组是不会执行回调函数的。案例1.数组求和 // 1.数组求和 var arr = [1,5,8,6,15,78,65,25,48,55] var sum = arr.reduce(function(total,currentValue){ ...原创 2018-11-17 11:42:17 · 591 阅读 · 1 评论 -
js--ajax异步交互
一、什么是AjaxAjax(Asynchronous JavaScript and XML的缩写)是一种异步请求数据的web开发技术,对于改善用户的体验和页面性能很有帮助。简单地说,在不需要重新刷新页面的情况下,Ajax 通过异步请求加载后台数据,并在网页上呈现出来。常见运用场景有表单验证是否登入成功、百度搜索下拉框提示和快递单号查询等等。Ajax目的:提高用户体验,较少网络数据的传输...原创 2018-12-24 12:19:07 · 644 阅读 · 0 评论 -
JavaScript:彻底理解同步、异步和事件循环(Event Loop)
一. 执行栈JS运行的环境称之为宿主环境。执行栈:call stack,一个数据结构,用于存放各种函数的执行环境,每一个函数执行之前,它的相关信息会加入到执行栈。函数调用之前,创建执行环境,然后加入到执行栈;函数调用之后,销毁执行环境。(单线程不容易冲突,但是效率低)浏览器执行线程浏览器是多进程的,浏览器每一个 tab 标签都代表一个独立的进程,其中浏览器渲染进程(浏览器内核)属于浏览器多进程中的一种,主要负责页面渲染,脚本执行,事件处理等。浏览器宿主环境中包含5个线程:...原创 2022-02-23 11:23:12 · 2192 阅读 · 1 评论 -
深入浅出Object.defineProperty()/new Proxy()---js对象的底层
Object.defineProperty() 和 Proxy 对象,都可以用来对数据的劫持操作。何为数据劫持呢?就是在我们访问或者修改某个对象的某个属性的时候,通过一段代码进行拦截行为,然后进行额外的操作,然后返回结果。那么vue中双向数据绑定就是一个典型的应用。Vue2.x 是使用 Object.defindProperty(),来进行对对象的监听的。Vue3.x 版本之后就改用Prox...原创 2019-03-21 16:42:02 · 1595 阅读 · 1 评论 -
js高级----回顾new做了什么、prototype、__proto__、constructor、原型链、继承、Class
回顾new做了什么、prototype、__proto__、constructor、原型链、继承、ClassClass类里面super是干嘛的super()执行父类的构造函数super()返回的是子类的实例为什么class中的方法可以使使用箭头函数对象、函数都会有_proto_这个属性,对象并不具有prototype属性,只有函数才有prototype属性原创 2019-04-10 12:20:34 · 703 阅读 · 0 评论 -
js高级---Object.create()方法实现对象继承与创建新的JavaScript对象
Object.create()方法是 ECMAScript 5中新增的方法,这个方法用于创建一个新对象,使用现有的对象来提供新创建的对象的__proto__。被创建的对象会继承另一个对象的原型,在创建新对象时还可以指定一些属性。1. Object.create()语法结构Object.create(proto [, propertiesObject])proto,{object},新...原创 2019-04-10 15:06:53 · 4449 阅读 · 0 评论 -
JavaScript 匿名函数自调(立即执行函数)
https://blog.youkuaiyun.com/ttx_laughing/article/details/78503344https://blog.youkuaiyun.com/limlimlim/article/details/9198111由于括弧()和JS的&&,异或,逗号等操作符是在函数表达式和函数声明上消除歧义的只要记住一点,匿名函数前面加的任何运算符、操作符都不起运算和...原创 2019-04-09 16:16:06 · 451 阅读 · 0 评论 -
JSON的使用、规则、地理位置、序列化/反序列化
一、json是什么?JSON,全称是Javascript Object Notation,即Javascript对象标记法JSON是一种轻量级(Light-Weight)、基于文本的(Text-Based)、可读的(Human-Readable)格式。JSON的名称中虽然带有Javascript,但这是指其语法规则是参考Javascript对象的,而不是只能用于Javascrip...原创 2019-04-14 22:58:01 · 985 阅读 · 0 评论 -
移动端 触摸事件和mousedown、mouseup、click事件之间的关系
一、移动端 触摸事件ontouchstart、ontouchmove、ontouchend、ontouchcancel1、Touch事件简介pc上的web页面鼠 标会产生onmousedown、onmouseup、onmouseout、onmouseover、onmousemove的事件,但是在移动终端如iphone、ipod Touch、ipad上的web页面触屏时会产生ontouc...原创 2018-10-22 18:33:51 · 22209 阅读 · 0 评论 -
js的对象与函数
一、对象 就是人们要研究的任何事物,不仅能表示具体事物,还能表示抽象的规则,计划或事件。 属性的无序集合,每个属性可以存一个值(原始值,对象,函数)对象的特性:封装,尽可能的隐藏对象的部分细节,使其受到保护。只保留有限的接口和外部发生联系。js 中{},[] 来定义数组和对象1.{ } 大括号,表示定义一个对象,大部分情况下要有成对的属性和值,或是函...原创 2018-09-28 18:07:49 · 2844 阅读 · 0 评论 -
js--获取/赋值文本值innerText/textContent、innerHTML的区别,获取表单的值;js事件对象属性target与currentTarget
一、获取/赋值文本值innerText/textContent、innerHTML<body> <div id="box_text"> <p style="color:hotpink;">muzidigbig</p> <p style="color:pink">lo原创 2018-10-06 10:44:49 · 7282 阅读 · 0 评论 -
js-if判断、switch、while、for循环、自增自减、逻辑运算符、break/continue
逻辑运算符逻辑运算只有2个结果,一个为true,一个为false.◆且&&★两个表达式为true的时候,结果为true.◆或||★只要有一个表达式为true,结果为true.◆非! ★和表达式相反的结果。总结:‘||’1.只要‘||’前面为false,不管‘||’后...原创 2018-06-21 10:05:42 · 3650 阅读 · 0 评论 -
js-Array(方法)、arguments(伪数组)、高级迭代、清空数组
数组赋值(初始化)☞Array对象赋值方式(常用)var mycars=new Array("Saab","Volvo","BMW");console.log(mycars);var mycars=new Array();mycars[0]="Saab";mycars[1]="Volvo";mycars[2]="BMW";console.log(mycars);//也可以使用一个原创 2018-06-21 15:45:46 · 1180 阅读 · 1 评论 -
js-函数(闭包、私有、递归、自调)、变量(隐士)和作用域
匿名函数闭包递归高阶函数函数柯里化变量和作用域变量声明提升作用域链原创 2018-06-21 16:51:05 · 3597 阅读 · 0 评论 -
js-对象和面向对象、Json
ECMA-262 把对象(object)定义为“属性的无序集合,每个属性存放一个原始值、对象或函数”。严格来说,这意味着对象是无特定顺序的值的数组。面向对象语言的要求一种面向对象语言需要向开发者提供四种基本能力:封装 - 把相关的信息(无论数据或方法)存储在对象中的能力 聚集 - 把一个对象存储在另一个对象内的能力 继承 - 由另一个类(或多个类)得来类的属性和方法的能力 多态 ...原创 2018-06-22 10:54:01 · 407 阅读 · 0 评论 -
js-事件
JavaScript 事件(常用)网页中的每个元素都可以产生某些可以触发 JavaScript 函数的事件。比方说,我们可以在用户点击某按钮时产生一个 onClick 事件来触发某个函数。事件在 HTML 页面中定义。事件举例:鼠标点击 页面或图像载入 鼠标悬浮于页面的某个热点之上 在表单中选取输入框 确认表单 键盘按键 注意:事件通常与函数配合使用,当事件发生时函数才会执行。事件三要素事件源、事...原创 2018-06-22 14:22:40 · 8129 阅读 · 0 评论 -
js基础学习+回顾大纲
假如要给js的三大部分分个大小的话:ECMAScript > BOM > DOM7. 值类型赋值: 直接将值复制一份赋值给新的变量改变的是值 引用类型赋值 将对象的地址值复制一份赋值给新的变量,两个变量同时指向同一个对象,修改其中一个另一个也受影响。8. 值类型做参数 ...原创 2018-06-23 17:13:18 · 1577 阅读 · 0 评论 -
JavaScript基础(DOM)-Document对象、Element 对象、Attribute 对象、动态的创建 删除 添加节点
JavaScript HTML DOM(文档对象模型)通过 HTML DOM,可访问 JavaScript HTML 文档的所有元素。当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model)。通过 JavaScript,您可以重构整个 HTML 文档。您可以添加、移除、改变或重排页面上的项目。要改变页面的某个东西,JavaScript 就需要获得...原创 2017-11-25 03:17:14 · 3568 阅读 · 0 评论 -
JavaScript基础(BOM)-Window 对象(定时器、窗口)、History 对象、Location 对象
JavaScript基础(BOM)-Window 对象、History 对象、Location 对象原创 2017-11-22 23:36:37 · 557 阅读 · 0 评论 -
JavaScript基础(ECMAScript)-js作用、js输出框、js放置、var变量、数据类型、js消息框
JavaScript基础-js作用、js输出框、js位置、js消息框、js事件及归总原创 2017-11-22 23:04:16 · 1269 阅读 · 4 评论 -
js--对css类操作、对style样式操作、获取表单的值
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> div{ width: 20原创 2018-06-28 10:30:55 · 570 阅读 · 0 评论 -
js--事件对象(keyCode、target)、js三大特效(offset、scroll、client)、js原生获取宽高度滚动个的距离
Event 对象Event 对象代表事件的状态,比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。事件通常与函数结合使用,函数不会在事件发生前被执行!Ie9以下浏览器中的事件对象是放在全局中的window.event;解决兼容性:event = event || window.eventscreenX、pageX和clientX的区别Pag...原创 2018-07-16 16:54:51 · 2513 阅读 · 1 评论 -
js 变量声明 (var使用与不使用的区别)
一、区分显示的声明与隐式声明(var)JS中变量声明分显式声明和隐式声明。var name = 'muzidigbig';//显示声明 name = 'muzidigbig';//隐式声明(为全局变量的一个属性)在函数中使用var关键字进行显式声明的变量是做为局部变量,在全局范围内声明的变量为全局变量;而没有用var关键字,使用直接赋值方式声明的是全局变量(全局对象属性)。/...原创 2018-07-17 09:52:31 · 6279 阅读 · 0 评论 -
js--补漏篇 addEventListener/attachEvent 和onXXX的用法及区别
首先介绍它们的用法:1.addEventListener()的用法:(同一个 dom 元素上,addEventListener 同/不同类型事件可以绑定多个。)形式:addEventListener(eventName,funtionName,useCapture)参数:event:事件的类型如 “click”(不要使用 "on" 前缀。 例如,使用 "click" ,而不是使用 ...原创 2018-07-18 14:47:49 · 1278 阅读 · 0 评论 -
js数据类型转换及常用方法、内置对象
JavaScript的内置对象· JS Array · JS Boolean · JS Date · JS Math · JS Number · JS String · JS RegExp · JS object· JS FunctiomDate 对象Date 对象用于处理日期和时间。创建 Date 对象的语法:var myDate=new Date()注释:Date 对象会自动把当前日期和时间保...原创 2018-06-21 07:44:42 · 479 阅读 · 0 评论