
JavaScript
lvshun_19991027
千万不要吃饱
展开
-
学习一下引用数据类型拷贝
对于引用数据类型,细分可以分为以下三个方面赋值 浅拷贝 深拷贝目录赋值:浅拷贝Object.assign()展开运算符...Array.prototype.slice()深拷贝总结赋值:只是改变指针的指向,例如,引用数据类型的赋值是对象保存在栈种的赋值,这样的化两个变量就都指向同一个对象,因此彼此之间的操作互有影响。举个例子:var a = {};var b = a;a.name = "ls";console.log(a.name); ..原创 2020-12-18 19:28:13 · 365 阅读 · 1 评论 -
有关闭包问题的个人见解
闭包简单来说就是两个函数嵌套,函数a的内部有个函数b,函数b可以访问函数a内的变量,那么函数b就是闭包。举个例子:function A(){ let a = 0; window.B = function (){ console.log(a) }}A();B(); //0闭包存在的意义就是让我们能够间接的访问函数内部变量。之前面试遇到的一个问题,循环中用闭包解决var 定义函数问题for (var i = 0 ; i < 10.原创 2020-12-18 17:34:55 · 209 阅读 · 1 评论 -
JS模块化开发
JS模块化开发总结文章目录前言 一、pandas是什么? 二、使用步骤 1.引入库 2.读入数据 总结前言网页越来越像桌面程序,需要一个团队分工协作、进度管理、单元测试等等......开发者不得不使用软件工程的方法,管理网页的业务逻辑。Javascript模块化编程,已经成为一个迫切的需求。理想情况下,开发者只需要实现核心的业务逻辑,其他都可以加载别人已经写好的模块。但是,ES6以前不是一种模块化编程语言,它不支持"类"(class),更遑论"模块"(module原创 2020-11-24 13:39:06 · 173 阅读 · 1 评论 -
面试题:有关js内存泄漏问题总汇~
内存泄漏?官方解释:内存泄漏(Memory Leak)是指程序中己动态分配的堆内存由于某种原因程序未释放或无法释放,造成系统内存的浪费,导致程序运行速度减慢甚至系统崩溃等严重后果。通俗点就是指由于疏忽或者错误造成程序未能释放已经不再使用的内存,不再用到的内存却没有及时释放,从而造成内存上的浪费。避免内存泄漏?在局部作用域中,等函数执行完毕,变量就没有存在的必要了,垃圾回收机制很亏地做出判断并且回收,但是对于全局变量,很难判断什么时候不用这些变量,无法正常回收;所以,尽量少使用全局变量。在使用闭包的转载 2020-08-05 22:38:56 · 533 阅读 · 0 评论 -
Javascript 复习内容——运算符
++ --a++ 先返回a的值 再执行a=a+1++a 先执行a=a+1 再返回a的值--同理&& ||&&如果两个操作数都不是布尔类型 如果两个值转换成布尔类型都是true 则返回第二个操作数 如果有一个操作数转换成布尔类型是false 则返回这个操作数var b= "qwe" &&"asd" console.log(b) // asd...原创 2020-06-14 16:28:56 · 168 阅读 · 0 评论 -
JavaScript实现鼠标滚轮事件——onmousewheel
通过滚轮改变div heightbind()请点击参考之前文章/*** * 滚轮调整div高度 */var box = document.getElementById("box");//为box绑定鼠标滚轮滚动事件/** * 火狐中不适用 需要用DOMMouseScroll绑定滚动事件 * 该事件需要通道addElementListener()事件来绑定 * */box.onmousewheel = function (event) { event = e.原创 2020-06-10 14:10:36 · 678 阅读 · 0 评论 -
javascript 定时器自定义函数,实现动画——移动元素位置
拿走直接用,兼容IE8及以下getStyle请参考之前文章function move(obj,target,speed,attr,callback) { clearInterval(obj.timer) //判断speed正负 //0-800移动 speed为正 // 800-0 speed为负] //当前位置 var current = parseInt(getStyle(obj, attr)); if (current &g原创 2020-06-10 14:06:47 · 236 阅读 · 0 评论 -
JavaScript定时器——setInterval()
介绍* 如果希望程程序间隔一段事件执行 可以使用定时调用* 定时器* setInterval()* 定时调用* 参数:* 1. 回调函数,该函数每隔一段时间被调用一次* 2.每次调用间隔的时间 单位毫秒* 返回值* 返回一个number类型的数据* 用来作为定时器的唯一标识详细介绍请参考w3c手册var count = document.getElementsByTagName("h1");var numbe...原创 2020-06-10 14:02:26 · 209 阅读 · 0 评论 -
JavaScript 常用Browser BOM总结
BOM* BOM 浏览器对象模型* 通过js操作浏览器* 在BOM中为我们提供了一组对象,用来完成对浏览器的操作* BOM对象* window* 代表的使整个浏览器的窗口,同时window也是网页中的全局对象* Navigator* 代表当前浏览器的信息,通过该对象能识别不同浏览器* Location* 代表当前浏览器的地址栏信息,通过Location可以获取地址栏信息,或者操作浏览器跳转页...原创 2020-06-10 13:55:45 · 340 阅读 · 1 评论 -
JavaScript自定义函数——bind()事件绑定
直接拿走,兼容IE8/*** * 指定元素绑定响应函数 * @param obj 绑定事件的对象 * @param eventStr 事件字符串(不要on) * @param callBack 回调函数 */function bind(obj, eventStr, callBack) { if (obj.addEventListener){ //大部分浏览器 obj.addEventListener(eventStr, call原创 2020-06-10 13:43:31 · 374 阅读 · 0 评论 -
JavaScript(十八)——HTML DOM ——拖拽
用鼠标拖动两方块思路:1. 获取两个div2.将onmousedown onmousemove onmouse事件绑定在div上/** * 拖拽 * onmouseup 鼠标按键被松开 * onmousedown 鼠标按钮被按下。 * onmousemove 鼠标被移动。 * */var box1 = document.getElementById("box1");var box2 = document.getElementById("box2");drag(bo...原创 2020-06-10 13:41:46 · 234 阅读 · 0 评论 -
跟我一起学JavaScript(十七)——自定义函数 改变元素CSS样式
代码直接拿走,复制粘贴都能用方便/*** * 定义函数获取样式 * obj:要获取样式的元素 * name 要获取的样式名 String */function getStyle(obj, name) { /* 单写getComputedStyle是属性,属性没找到返回undefined 但window.getComputedStyle是变量,浏览器没找到返回false */ if(window.getComputedSt原创 2020-06-10 11:28:30 · 254 阅读 · 0 评论 -
JavaScript(十六)——HTML DOM对象知识点(二)——键盘事件
键盘事件基础* onkeydown 按键被按下* 如果一直按一个按键不松手则事件连续触发* onkeydown连续触发时,第一次和第二次之间间隔长一点* 防止误操作发生** onkeyup 按键被松开*** 键盘事件一般会绑定到 能获取到焦点的按键 如,input 或documentInternet Explorer 使用 event.keyCode 取回被按下的字符,而 Nets原创 2020-06-10 11:14:55 · 151 阅读 · 0 评论 -
JavaScript(十五)——HTML DOM 对象知识点(一)____div跟随鼠标移动
Event想要实现div跟随鼠标移动我们应该知道有关鼠标的event事件onmousedown 当鼠标按下时发生 onmouseup 当鼠标松开时发生 onmousumove 当鼠标移动时时发生 onmouseout 当鼠标移出某元素时发生 onmouseover 当鼠标移动到某元素时发生这里用的时onmousemove 当鼠标移动时div跟着动首先我们需要一个div 需要绝对定位,代码如下(div id 为box) ...原创 2020-06-10 09:52:59 · 171 阅读 · 0 评论 -
JavaScript浅显易懂(十四)——包装类
* 基本数据类型* Number null undefined String Boolean* 引用数据类型* Object** 三个包装类,通过包装类可以将基本数据类型的数据转化为对象* String() 将基本数据类型字符串转换成String对象* Number() 将基本数据类型数值转换成Number对象* Boolean() 将基本数据类型布尔值转换成Boolean对象var num = new Number(3);var str = new String("Hell..原创 2020-06-08 00:13:02 · 133 阅读 · 1 评论 -
苦肝JavaScript第三天 浅显易懂(十三)——Array数组去重
slice()从数组中提取想要的元素splice()删除数组中指定元素splice(start , deleteCount, items);可以这么简单记参数start:数组中的第几位deleteCount:删除几个元素items:需要添加的元素short()括号里面是个函数,函数返回值小于0则a排在b前面,即a与b的位置不变 大于0将a排在b的后面,即a...原创 2020-06-08 00:11:18 · 144 阅读 · 0 评论 -
记录学习JavaScript的第三天 浅显易懂(十二)——正则表达式——电子邮件
正则表达式之电子邮件合法性思路和上一篇一样:上一篇文章 正则表达式之手机号合法性我想到的电子邮件的规则如下,欢迎补充:* hello.javascript@abc.com.cn** 任意字母数字下划线 .任意字母数字下划线 @ 任意字母数字 .任意字母 2-5位 .任意字母 2-5位 对应正则表达式:(不会的看我之前文章 点我点我!)\w{3,} (\.\w+)* @ [A-z0-9]+ (\.[原创 2020-06-07 23:53:56 · 253 阅读 · 0 评论 -
记录学习JavaScript的第三天 浅显易懂(十二)——正则表达式——手机号是否合法测试
创建正则表达式检查手机号的合法性思路:首先要想的是手机号的规则是什么,根据规则设计正则表达式。* 手机号规则* 1. 手机号总共11 位数字组成* 2. 手机号以1开头* 3. 手机号第二位为 3-9 任意数字* 4. 手机号第三位以后为任意数字9个正则表达式为:^1 [3-9] [0-9]{9}$ var phoneStr = "13567890123"; var phoneReg = /^1[3-9][0-原创 2020-06-07 23:46:27 · 218 阅读 · 0 评论 -
JavaScript浅显易懂(十一)——正则表达式
正则表达式 正则表达式 - 用于定义一些字符串的规则 计算机可以用正则表达式,来检查一个字符串是否符合规则 获取字符串中符合规则的内容提取出来创建正则表达式var 变量 = new RegExp("正则表达式", "匹配模式")var 变量 = /正则表达式/匹配模式匹配模式可以是:i 忽略字母大小写 g 全局匹配模式//这个正则表达式可以检查一个字符...原创 2020-06-07 23:38:54 · 156 阅读 · 0 评论 -
JavaScript浅显易懂(十)——onclick练习
不多说先上代码 很简单 适合新手练习HTML<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> *{ //清除默认样式 margin: 0; padding: 0; ..原创 2020-06-07 23:13:42 · 212 阅读 · 0 评论 -
JavaScript浅显易懂(九)——原型对象 prototype
JavaScript——prototype我们所创建的每一个函数,解析器都会向函数中添加一个属性 prototype,这个属性对应着一个对象,这个对象就是我们所谓的原型对象。如果函数作为普通函数调用prototype没有任何作用,当函数以构造函数调用时,他所创建的对象中都会有一个隐含的属性,指向该构造函数的原型对象 ,可以通过_proto_访问该属性。原型对象就相当于一个公共区域,所有同一个类的实例都能访问这个原型对象 我们可以将对象中共有的内容同一设置到原型对象中,当我们访问对象的一个属原创 2020-06-07 09:45:51 · 175 阅读 · 0 评论 -
JavaScript浅显易懂(八)——在文档中创建并插入新的节点 createElement /querySelector/ insertBefore
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>ColdPlay</title></head><body> <h1 id = "page-title">ColePlay</h1> <ul class="artist-list"> &.原创 2020-06-06 19:08:46 · 377 阅读 · 0 评论 -
JavaScript浅显易懂(七)——选择元素的方法(二) querySelector、queySelectorAll
querySelectorquerySelector()方法会返回找到的第一个元素querySelectorAllquerySelectorAll()方法会返回找到的所有元素/** var artistList = document.querySelector('.artist-list')* artistList.childNodes 获取所有artistList的子节点* artistList,childElementCount 查看所有元素类型的子节点个数* art原创 2020-06-06 18:59:58 · 327 阅读 · 0 评论 -
JavaScript浅显易懂(六)——选择元素的方法(一) getElementById、getElementsByTagName
getElementByIdgetElementById() 方法可返回对拥有指定 ID 的第一个对象的引用。查找文档中的一个特定的元素最有效的方法。getElementsByTagNamegetElementsByTagName() 方法可返回带有指定标签名的对象的集合。getElementsByTagName() 方法返回元素的顺序是它们在文档中的顺序。如果把特殊字符串 "*" 传递给 getElementsByTagName() 方法,它将返回文档中所有元素的列表,元素排列的顺序就原创 2020-06-06 18:49:47 · 818 阅读 · 0 评论 -
努力学习JavaScript的第8个小时!浅显易懂(五)——文档树 DOM tree
DOM操作文档的接口使用JavaScript可以更改网页文档的结构、样式和内容,不过我们并不能直接的使用JavaScript来做这件事,而是通过一些接口,这些接口就是DOM(Document Object Model).DOM不是一种语言,而是众多浏览器必须遵循的一种规则,一个网页就是一个文档,这个文档可能显示在浏览器的窗口里面或者是文档的源代码。DOM其实提供了另一种方法来表示存储和操纵这个文档的方法——用对象来表示文档,DOM定义的所有的用来操作文档的属性、方法、事件都组织在对象里面。文档里面所原创 2020-06-06 15:46:18 · 241 阅读 · 0 评论 -
跟我一起学JavaScript!!!浅显易懂(四)——Object
目录Object对象创建对象对象里的数组更新和删除对象的属性为对象添加新方法循环输出对象的属性Object对象JavaScript除了五种基本数据类型,其他的都是对象。简单来说,一个对象就像一个东西,比如苹果、汽车等都是一个对象。每一个对象都有它的特性,苹果的颜色、味道、大小等。颜色有红的、绿的;味道有甜的、酸的;大小有大的、小的;这些特性在Javascript中叫做对象的属性(property),对象里的属性就相当于对象里面的变量。对象中也有一...原创 2020-06-06 15:20:51 · 151 阅读 · 0 评论 -
JavaScript浅显易懂(三)——function函数
function函数声明方式定义函数:function functionName (parameter1, parameter2...) {...}函数表达式:var functionName = function (parameter1, parameter2...){. . .}一个函数就是一块带名字的代码,可以在应用里面重复的调用和执行定义好的函数去做一些事情定义一个函数定义一个函数可以用函数声明的方式也可以用函数表达的方式函数声明function alertMe.原创 2020-06-06 14:35:36 · 349 阅读 · 0 评论 -
JavaScript浅显易懂(二)——控制流程
JavaScript控制流程if...else...switchwhilefor用法跟java差不多if...else...使用if语句我们可以判断指定的条件是真的还是假的,然后去执行指定的代码块(声名块)。格式如下var weather = '雷雨', temperature = 1100;if ((weather == '晴天') && (temperature <= 26)) { alert("心情不错");}else if (.原创 2020-06-06 14:23:16 · 137 阅读 · 0 评论 -
JavaScript浅显易懂(一)——数据类型
目录JavaScript五种基本数据类型在进行计算的时候出现的问题用Typeof()来查看当前变量的数据类型String——文本字符串的处理JavaScript一种复杂数据类型 (Object)(一)——ArrayJavaScript五种基本数据类型NumberBooleanStringNullUndefinedNumber、Boolean、Null、Undefined(没有编译的值) 很简单这里就不具体说了 下边会有涉及。在进行计算的时候出现..原创 2020-06-05 21:10:55 · 212 阅读 · 0 评论