JS
关注
分享
扫一扫
文章平均质量分 78
子月吾生
one day by one day
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
监听页面隐藏掉的事件
1、visibilitychange事件：当document.visibilityState == hidden的时候可以监听到页面被隐藏。（当你在移动端直接从一个app页面划到主页面或者跳转到其它页面就会监听到该事件）document.addEventListener("visibilitychange", function() { if (document.visibilityState == 'hidden') {...}}})2、pagehide事件：当你在移动端从一个app页面划到原创 2021-01-25 17:46:28 · 1197 阅读 · 0 评论 -
详解深拷贝和浅拷贝以及如何深拷贝
深拷贝和浅拷贝一、如何区分深拷贝和浅拷贝二、举例加深理解深拷贝和浅拷贝三、图文理解四、哪些方法是浅拷贝，如何进行深拷贝一、如何区分深拷贝和浅拷贝内在的区别：浅拷贝就是简单的把指向别人的值的一个指针给复制过来，深拷贝就是实实在在的把别人的值给复制过来。直接显示出来的区别：浅拷贝就是双方不是独立的，还会互相影响；深拷贝是不会影响到彼此，是独立的个体。深拷贝与浅拷贝的存在主要还是受拷贝的数据类型所影响的。当拷贝的是js基本数据类型时，都会是深拷贝；如果拷贝的是js引用数据类型时，简单的赋值过来的时候就原创 2020-09-10 10:50:17 · 4228 阅读 · 0 评论 -
理解js栈内存和堆内存
内存分配与垃圾回收：在编译阶段，除了声明变量和函数，查找环境中的标识符这两项工作之外，还会进行内存分配。不同类型的数据会分配到不同的内存空间一般来说栈内存线性有序存储，容量小，系统分配效率高。而堆内存首先要在堆内存新分配存储区域，之后又要把指针存储到栈内存中，效率相对就要低一些了。垃圾回收方面，栈内存变量基本上用完就回收了，而推内存中的变量因为存在很多不确定的引用，只有当所有调用的变量全部销毁之后才能回收。栈内存：引擎执行代码时工作的内存空间，除了引擎，也用来保存基本值和引用类型值的地址。堆原创 2020-09-09 11:46:24 · 516 阅读 · 0 评论 -
JS引用类型中的Date类型
一， 了解Date的使用Date类型使用使用UTC(Coordinated Universal Time,国际协调时间)1970年1月1日午夜（零时）开始经过的毫秒数来保存日期。要创建一个日期对象，使用new操作符和Date构造函数即可如下：var now = new Date();alert(now);//如图一所示，返回的是中国标准时间在调用Date函数而不传参的情况下...原创 2018-12-10 17:32:46 · 1751 阅读 · 0 评论 -
限制input输入长度与内容
如果输入的是数字，通过监听input事件再通过slice进行截取限制长度<input type="number" oninput="f(value.length>6)value=value.slice(0,4)">如果输入的是文字或者字符，就会有一个maxlength属性进行限制长度<input type="text" placeholder="只能输入六个字符" maxlength="6">...原创 2020-09-07 20:02:48 · 13968 阅读 · 0 评论 -
详解slice，substring，substr的区别
slice,substring和substr的区别都接收两个参数，slice和substring接收的是起始位置和结束位置(不包括结束位置)，而substr接收的则是起始位置和所要返回的字符串长度。其中substring是以两个参数中较小一个作为起始位置，较大的参数作为结束位置，slice是将后面小的参数转化为0slice是数组和字符串都可以使用，返回截取到的值，不影响原数组和字符串；substring和substr只有字符串可以使用，返回截取到的字符串。//参数都是比较正常的情况下var st原创 2020-08-26 16:28:01 · 1212 阅读 · 0 评论 -
瞄点到某个具体位置的实现方式
1、给要瞄点文本添加id属性（id属性针对任何标签都生效）,通过a标签href属性的hash值进行跳转<body> <div id="go-here">待瞄点文本</div> <div> <span><a href="#go-here"></a><\span> </div></body>2、给要瞄点文本添加name属性（name属性针对a标签生效）,通过a标签h原创 2020-08-14 17:51:28 · 344 阅读 · 0 评论 -
JS阻止事件冒泡和默认行为
1、首先对事件冒泡和默认行为以及要用到的事件对象event有个认识对事件冒泡的理解是当触发一个子元素的事件时，同时它的父元素的事件也会依次被触发。即事件从最低层元素依次向最外层元素触发默认事件（行为）指的是有些元素自身会有一些行为会自行被触发。例如< a>链接，提交按钮< input type = ‘submit’/>event代表事件的状态。例如触发event对象...原创 2019-06-02 17:27:15 · 2456 阅读 · 0 评论 -
了解JSON数据格式
一、JSON的基本概念加粗样式**JSON:JavaScript的对象表示法JSON是存储和交换文本信息的语法，类似于XM。它采用键值对的方式来组织，易于我们阅读和编写，同时也易于机器解析和生成JSON是独立于语言的，也就是说不管什么语言都可以解析json,只要按照json的规则来就行二、JSON和XML比较json的长度和xml格式比起来是很短小的json读写的速度很快...原创 2019-06-13 21:32:43 · 493 阅读 · 0 评论 -
解决前端跨域的方法有哪些
1、首先一个域名的组成：当协议、子域名、主域名、端口号中任意一个不相同时，都算作不同域JavaScript出于安全方面的考虑，不允许跨域调用其它页面的对象。跨域就可以理解为因为JavaScript同源策略的限制，a.com下的js无法操作b.com或者c.a.com域名下的对象。2、处理跨域的方法：1)处理方法一——在后台进行处理：通过在同域名下web服务器创建一个代理例如某个前端页面...原创 2019-06-14 19:32:03 · 642 阅读 · 0 评论 -
前端面试之js基础
一、说说BOM和DOM1、BOM——浏览器对象模型1）BOM主要用于管理窗口与窗口之间的通讯,可以对浏览器窗口进行访问和操作。用来获取或设置浏览器的属性、行为，例如：新建窗口、获取屏幕分辨率、浏览器版本号等2）BOM的核心是window对象。属性 window对象有很多属性例如navigator、screen、history、location、documentnavigator:...原创 2019-06-30 22:47:45 · 293 阅读 · 0 评论 -
对比promise的流程控制和js的回调
例如写一个方块不断移动的动画，首先写一个移动动画的函数，然后不断的调用，用传统写法如下：//动画函数function moveTo(el,x,y,cb) { el.style.transform = `translate(${x}px,${y}px)`; setTimeout(function() { cb && cb();//此处用了&...原创 2019-08-19 17:49:08 · 236 阅读 · 0 评论 -
js事件循环机制相关定义
(1)、当javascript代码执行的时候会将不同的变量存于内存中的不同位置：堆（heap）和栈（stack）中来加以区分。其中，堆里存放着一些对象。而栈中则存放着一些基础类型变量以及对象的指针。 但是我们这里说的执行栈和上面这个栈的意义却有些不同。(2)、当我们调用一个方法的时候，js会生成一个与这个方法对应的执行环境（context），又叫执行上下文。这个执行环境中存在着这个方法的私有作用...原创 2019-08-21 11:04:24 · 410 阅读 · 0 评论 -
闭包面试题之闭包解决for循环打印
闭包的作用: 正常函数执行完毕后,里面声明的变量被垃圾回收处理掉,但是闭包可以让作用域里的 变量,在函数执行完之后依旧保持没有被垃圾回收处理掉1、正常的for循环打印for (var i = 0; i < 4; i++) { console.log(i);输出的是0、1、2、32、加了延迟的for循环打印for (var i = 0; i < 4; i++) { ...原创 2019-08-21 11:27:41 · 1562 阅读 · 0 评论 -
js实现小球随机运动
HTML <div class='box'> <div class='ball'></div> </div>style:.box{ width:300px; height:400px; background-color:green; opacity:0.5; margin:auto; position:r...原创 2019-09-29 00:09:24 · 2691 阅读 · 1 评论 -
JavaScript类的理解及prototype和_proto_属性
面向对象编程的的思想1、先大概抽象理解一下一些常用词的定义：类：定义某一事物的抽象特点，包含属性和方法对象：类的一个实例继承性：一个类会有子类，这个子类是更具体化的一个抽象，它包含了父类的一些属性和方法，也可能有不同于父类的属性和方法JS并没有类(class)的概念,更多的时候我们把它叫做对象（function）,然后把对象叫做实例（instance）。在JS里面我们通常是通过构造函...原创 2019-05-26 16:25:28 · 565 阅读 · 0 评论 -
JS数组的遍历方法汇总及区别
总的遍历方法：1、经典遍历方法：for语句、forEach语句、for-in语句、for-of语句2、其它循环方法：map(映射)方法、filter(过滤)方法、every方法、some方法、reduce方法(reduceRight)3、不常用的方法：find方法、findIndex方法4、ES6提供的三个新方法：keys方法、values方法、entries方法下面是各方法的用法和区别...原创 2019-05-08 23:28:31 · 757 阅读 · 0 评论 -
简单的理解事件冒泡与事件捕获
例如下面的图中外面的绿色的框为父级（parent），里面的橙色框为子级(child) var parent = document.getElementsByClassName("block_P")[0]; var child = document.getElementsByClassName("block_C")[0]; parent.onclick=function() {//...原创 2018-09-24 14:18:08 · 309 阅读 · 0 评论 -
面试题解析
1.var length = 10;function fn() {console.log(this.length);}var obj = {length: 5,method: function(fn) {fn();arguments0;}};obj.method(fn, 1);输出结果：10；22.请给Array本地对象增加一个原型方法，它用于删除数组条目中重复的条目(可...原创 2018-09-20 19:07:17 · 411 阅读 · 0 评论 -
轻松记住正则表达式
（一）在JavaScript中，可以使用RegExp()内置函数创建正则表达式对象。正则表达式直接量也被定义为包含在一对斜杠(/)之间的字符 如： var expression = / pattern / flags;其中模式（pattern）部分可以使任何简单或者复杂的正则表达式如字符类，限制符，分组等，每个正则表达式可以带有一个或者多个标志（flags）,用以表明正则表达式的行为。正则表...原创 2018-11-09 20:57:48 · 297 阅读 · 0 评论 -
详解JS中的基本数据类型和引用数据类型
js的基本数据类型和引用数据类型js的六大数据类型Number, String, Boolean, Undefined , Null , Object基本数据类型：Number,String,Boolean, Null引用数据类型：Object , Array, Function如何区别两者1.对于存放两种数据类型的变量 ：存放 js基本数据类型的变量存放的是基本类型...原创 2018-12-08 00:05:55 · 3682 阅读 · 0 评论 -
JS中的Function类型——函数属性和方法【this,arguments对象；apply(),call方法】
一，了解函数1，函数实际是对象，每个函数都是Function类型的实例，而且都与其他引用类型一样具有属性和方法，由于函数是对象，因此函数名实际上也是一个指向函数对象的指针，不会与某个函数绑定。2，函数没有重载，当声明了两个同名函数时结果会是后面的函数覆盖前面的函数。二，函数的内部属性在函数内部，有两个特殊的对象：arguments和this函数内部的arguments对象：1，...原创 2018-12-13 15:32:25 · 685 阅读 · 0 评论 -
JS中的Boolean,Number,String类型
为了便于操作基本类型的值,ECMAScript提供了三个特殊的引用类型：Boolean,Number,String一，基本包装类型与引用类型的主要区别每当读取一个基本类型的值时，后台就会创建一个对应的基本包装类型的对象，从而能够让我们调用一些方法来操作这些数据。在读取模式中访问字符串时后台都会自动完成下列处理(Number和Boolean处理相同)：（1）创建String类型的一个实列...原创 2018-12-16 23:24:57 · 331 阅读 · 0 评论 -
JS中的String类型
String类型是字符串的对象包装类型，可以像下面这样使用String构造函数来创建。 var stringObject = new String("hello world");一，字符方法用于访问字符串中特定字符的两个方法：charAt()和charCodeAt()。这两个方法都接收一个参数，即基于0的字符位置。charAt()方法以单字符串的形式返回给定位置的那个字符。cha...原创 2018-12-23 14:08:23 · 1109 阅读 · 1 评论 -
js中的Global、Math对象及其方法——引用类型中的单体内置对象
一、什么是单体内置对象ECMA-262对内置对象的定义是：有ECMAScript实现提供的，不依赖于宿主环境的对象,这些对象在ECMAScript程序执行之前就已经存在了。意思就是开发人员不必显式的实例化内置对象因为它们已经实例化了。像Object、Array、String对象都属于内置对象，在写代码时不用专门的去实例化它们。ECMA-262还定义了两个单体内置对象：Global和Math...原创 2018-12-23 20:52:56 · 359 阅读 · 0 评论 -
JS创建对象（工厂模式、构造函数模式、原型模式）
虽然Object构造函数或对象字面量都可以用来创建单个对象，但这些方式有个明显的缺点：使用同一个接口创建很多对象，会产生大量的重复代码。所以开始使用工厂模式的一个变体来解决这个问题。一、工厂模式该模式抽象了创建具体对象的过程。考虑到ECMAScript中无法创建类，开发人员就发明了一种函数，勇悍数来封装以特定接口创建对象的细节。如下所示： function createPerson(na...原创 2018-12-28 23:23:16 · 251 阅读 · 0 评论 -
JS理解原型对象及in操作符（创建对象中的原型模式）
一、理解原型对象无论什么时候，只要创建了一个新函数，就会根据一组特定的规则为该函数创建一个prototype属性，这个属性指向函数的原型对象。在默认情况下，所有原型对象都会自动获得一个constructor(构造函数)属性，这个属性是一个指向prototype属性所在函数的指针。就拿下面的例子来说，Person.prototype.constructor指向Person。。而通过这个构造函...原创 2018-12-25 20:47:17 · 390 阅读 · 0 评论 -
JavaScript初级面试题（一）
一、 关于字符串如何截取原创 2019-02-20 23:36:21 · 1591 阅读 · 0 评论 -
如何使用ajax（使用步骤、同步异步、get和post）
一、ajax简介1、是asynchronous javascript and XML 的简写。翻译过来就是异步的javascript和XML，其中XML（Extensible Markup Language）是指可扩展标记语言，是标准通用标记语言的子集,是一种用于标记电子文件使其具有结构性的标记语言。2、ajax这一技术能够向服务器请求额外的数据而无需卸载页面，会带来更好的用户体验。3、...原创 2019-03-09 13:35:24 · 407 阅读 · 0 评论 -
canvas应用
&lt;head lang="en"&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&lt;/title&gt; &lt;style&gt; .btn{ positio原创 2019-03-10 09:43:50 · 376 阅读 · 0 评论 -
JavaScript初级面试题（二）
一、关于元素1、JavaScript中获取某个元素有哪几种方式？ document.getElementById(); document.getElementsByClassName(); document.getElementsByName(); document.getElementsByTagName(); document.querySelec...原创 2019-04-26 01:23:13 · 288 阅读 · 0 评论 -
离线存储
Web存储机制Web Stroage的两个主要目标：提供一种在cookies之外存储会话数据的途径提供一种存储大量可以跨会话存在的数据的机制—— storage类型： 提供最大的存储空间来存储名值对儿。有如下方法：clear()： 删除所有值。firefox中没有实现。getItem(name)： 根据指定的属性名字获取对应的值。key(index)： 获得in...原创 2018-09-13 12:32:19 · 709 阅读 · 0 评论