JavaScript学习
文章平均质量分 53
yangyalun
这个作者很懒,什么都没留下…
展开
-
JS的this问题
daJS的this一共可分为四类。分别是:默认绑定; 隐式绑定(上下文绑定); 显式绑定; new绑定;优先级:new绑定>显示绑定>隐式绑定>默认绑定那么什么是默认绑定、隐式绑定、显式绑定、new绑定呢?下面开始看例子:var name = 'jack';function person() { console.log(this.name); //jack}person();打印jack,这是因为person函数的调用环境是全局,也就是window,这原创 2021-11-25 17:33:02 · 307 阅读 · 0 评论 -
JS事件流
1.事件:事件是指JS与HTML的交互。2.事件流:IE的事件流是指事件冒泡,Netscape的事件流是指事件捕获。(Netscape是网景通信公司,曾是一家美国的计算机服务公司,曾是IE的竞争对手,在1998年11月被AOL收购)。事件冒泡是指自下而上,事件捕获是指自上而下。3.DOM事件处理:DOM事件处理分为4个级别,分别是DOM0,DOM1,DOM2,DOM3,其中DOM1级事件处理标准中没有定义相关的内容,所以就没有所谓的DOM1事件处理。DOM3级事件处理是在DOM2级事件处理的基础上添原创 2020-09-30 19:35:54 · 672 阅读 · 0 评论 -
call、apply和bind
function test(){ console.log(this) } test();//打印window var t=new test()//打印test(){}首先我们要明白上面这个this指向问题,普通函数调用,this指向window,而通过new来实例化一个构造函数的对象,则this指向函数。1.call、apply和bind 的相同点和不同点相同点:ca...原创 2020-09-30 14:20:13 · 4967 阅读 · 1 评论 -
JS的事件循环(Event Loop)
JS中的事件分为两种,一种是同步,一种是异步。首先执行同步事间,然后执行异步事件。在异步事件的任务队列中,又分为宏任务和微任务,先执行微任务再执行宏任务。宏任务主要包括script( 整体代码)、setTimeout、setInterval、I/O、UI 交互事件、setImmediate(Node.js 环境);微任务主要包括Promise、MutaionObserver、process.nextTick(Node.js 环境)。下面看一段代码。 window.onload = fun原创 2020-09-30 12:25:53 · 155 阅读 · 0 评论 -
let、const与var
1.var只区分全局变量与函数变量,{var i=1}console.log(i),会打印出1,可以看出{}是限制不了var的。let属于块级变量,即 {leti=1}console.log(i)会报错i未定义。2.var可以变量提升,即可以先调用后声明,比如i=1;var i;console.log(i);会打印1。let不可以,即i=1;let i;console.log(i)会报错不能在i初始化前访问i。3.var可以在相同作用域内重复使用,即{var i=1;var i=...原创 2020-09-22 21:53:13 · 190 阅读 · 1 评论 -
JS基本数据类型的介绍及其相关操作
JS的基本数据类型有null,undefined,number,string,boolean。若要判断一个元素的类型,可通过typeof来判断。比如说: var num=1; alert(typeof num);//弹出number var str="aaa"; alert(typeof str);//弹出string var bool=true; aler原创 2020-09-22 19:50:03 · 205 阅读 · 0 评论 -
闭包
1.什么是闭包?闭包就是能够读取其他函数内部变量的函数,比如函数a里面一个函数b,b引用了a的变量,这就形成了一个闭包,比如: function outer() { var a=0; return function inner() { a++; console.log(a) } }原创 2020-09-19 15:58:20 · 144 阅读 · 0 评论 -
JS的__proto__,prototype和constructor
function Test(){};var f1=new Test();test()是一个构造函数。引申:构造函数与普通函数:构造函数:1.用new关键字调用;2.函数内部可以使用this关键字;3.一般不使用return;4.函数名首字母大写普通函数:不需要使用new关键字调用;2.函数内部不建议使用this;3.可以使用return;4.函数首字母小写比如: window.onload = function (a,b) { /*1.普通函数原创 2020-09-12 13:54:21 · 225 阅读 · 0 评论 -
Promise总结
一.Promise产生的背景前言:JavaScript是单线程语言,所以在执行耗时较大的任务时会导致页面阻塞。为了解决页面阻塞,异步执行被提了出来(异步被放在任务队列中,当所有同步执行完毕再去执行异步,而任务队列的异步有不是依次执行,谁耗时少就先执行谁)。异步带来一个执行顺序的问题,要想按照顺序依次执行,怎么办呢?最传统的方法是使用回调函数,也就是callback,但是callback是嵌套型的,就产生了很多弊端,比如:代码耦合性强,阅读起来不直观。后来ES6新增了一个Promise,Promise的到原创 2020-09-09 16:27:26 · 467 阅读 · 0 评论 -
promise
Promise是什么JS就是操作对象上的属性和方法,对于一个对象,想要了解,我们可以直接从其身上的属性和方法入手;直接使用console.dir(对象)打印出来Promise对象从上面打印出来的属性和方法,可以看到Promise是一个构造函数,有属于自己私有的all,reject,resolve,rece等方法,也有原型上面的,属于实例对象调用的方法then,catch...转载 2020-03-30 22:32:32 · 211 阅读 · 0 评论 -
JS数组去重方法
一.一维数组去重 var arr=[1,2,1,2]; //定义一个空数组 var arr1=[]; //遍历原始数组,若新数组中没有这个元素,那么就将该元素添加到新数组中 for (var i=0;i<arr.length;i++){ ...原创 2019-07-12 21:06:37 · 392 阅读 · 0 评论 -
JS的浅拷贝和深拷贝
为了更好的理解js的深浅拷贝,我们先来理解一些js基本的概念 ——Javascript有五种基本数据类型(也就是简单数据类型),它们分别是:Undefined,Null,Boolean,Number和String。还含有一种复杂的数据类型(也叫引用类型),就是对象注意Undefined和Null的区别,Undefined类型只有一个值,就是undefined,Null类型也只有一个值,也就...转载 2019-05-17 15:40:44 · 155 阅读 · 0 评论 -
MapGis前端开发笔记一
一.开发环境:MapGIS IGServer10.0、OpenLayers3二.需求分析:前端界面的道路网通过捕捉周边的点要素个数,以此作为权重来对道路网进行颜色带的渲染。三.思路:1.由于路网的线要素较长,故首先要将线要素进行划分,合理来说,应该是按照距离划分的。2.对新的道路做缓冲区分析,缓冲区半径自定义。3.通过缓冲区与周围点要素进行空间查询,得到每个缓冲区查询到的点要素个数。4.将...原创 2019-05-17 15:12:39 · 3037 阅读 · 6 评论 -
循环/闭包/setTimeout/Promise 综合
原文出处:https://zhuanlan.zhihu.com/p/25407758金三银四搞事季,前端这个近年的热门领域,搞事气氛特别强烈,我朋友小伟最近就在疯狂面试,遇到了许多有趣的面试官,有趣的面试题,我来帮这个搞事 boy 转述一下。以下是我一个朋友的故事,真的不是我。for (var i = 0; i < 5; i++) { console.log(i);}...原创 2019-05-15 19:54:43 · 265 阅读 · 0 评论 -
JS数组的操作总结
1.数组的定义。var arr=new Array();var arr=[];2.数组的push、pop、shift、unshift。(1)arr.push();向数组屁股后插入任意数量的任意类型的数据,并返回其长度。如:var arr=["yyl"];arr.push(25);console.log(arr);//["yyl",25](2)arr.pop();从...原创 2019-04-11 12:38:04 · 139 阅读 · 0 评论 -
JS制作日历
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" type="text原创 2018-04-08 17:55:12 · 547 阅读 · 0 评论 -
JS延时器
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" type="text原创 2018-04-09 14:16:44 · 2962 阅读 · 0 评论 -
JS图片无缝运动
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" type="text原创 2018-04-09 16:09:21 · 409 阅读 · 0 评论 -
JS侧边栏的显示和消失
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> #div1{ width:原创 2018-04-09 16:41:05 · 1778 阅读 · 0 评论 -
JS第一个面向对象程序
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script> function creatPerson(n,q原创 2018-04-10 17:53:41 · 147 阅读 · 0 评论 -
JS的原型
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script> var array1=new Array(1,2原创 2018-04-10 19:35:47 · 135 阅读 · 0 评论 -
JS缓冲运动
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> #div1{ width:原创 2018-04-11 11:15:08 · 189 阅读 · 0 评论 -
JS做时钟
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" type="text原创 2018-04-09 13:35:46 · 442 阅读 · 0 评论 -
JavaScript实现对话框的拖拉
//拖拉对话框函数,这个header div要在body div内部 function dragFunction(header,body) { var disX=0; var disY=0; //拖拉信息框函数 header.onmousedown=function (ev) {...原创 2018-10-24 21:47:38 · 194 阅读 · 0 评论 -
变换:给定一个字符串作为输入,将其中的数字用数字前近邻的字母序列进行替换,字母序列重复的次数等于该数字。最后将字符串输出。 例如: 输入:’a2bc3d1’ 输出:’aabcbcbcd’
JS中,字符串的基本操作有:1.search 查找2.substring 获取子字符串3.charAt 获取某个字符4.split分割字符串,获得数组JS中,数组的基础操作有:1.push()方法可以在数组的末属添加一个或多个元素2.pop()方法把数组中的最后一个元素删除3.shift()方法把数组中的第一个元素删除4.unshift()方法可以在数组的前端...原创 2018-10-25 14:18:27 · 1615 阅读 · 0 评论 -
原生JS写Ajax
打电话的流程1.手机2.拨号3.说话4.听从服务器上取数据1.创建ajax对象2.连接到服务器3.发送请求4.接收返回值html文件的代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title原创 2018-10-29 20:11:01 · 133 阅读 · 0 评论 -
JS和jQuery实现表格拖拉
总结: 通过jQuery和原生JS的拖拉写法,有以下总结。1.假如获取div元素高宽。jQuery使用$("div").width();JS使用$("div")[0].offsetWidth/clientWidth/scrollWidth (1)scrollWidth:对象的实际内容的宽度,不包边线宽度,会随对象中内容超过可视区后而变大。 (2)clientWidth:对象内容的可...原创 2019-01-15 17:27:55 · 606 阅读 · 0 评论 -
邮件中全选,不选,反选功能
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script> window.onload=function (原创 2018-04-08 16:38:32 · 397 阅读 · 0 评论