![](https://img-blog.csdnimg.cn/20201014180756916.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
JS
JS学习笔记
百事可爱-后悔下凡
空
展开
-
数组去重
方法一:双层循环,外层循环元素,内层循环时比较值如果有相同的值则跳过,不相同则push进数组Array.prototype.distinct = function(){ var arr = this, result = [], i, j, len = arr.length; for(i = 0; i < len; i++){ for(j = i + 1...原创 2020-05-03 09:47:29 · 75 阅读 · 0 评论 -
jQuery.html() .text()和.val() 的用法
jQuery.html() .text()和.val() 的用法原创 2018-09-24 15:21:12 · 102 阅读 · 0 评论 -
foreach和each的区别
forEach是js中的方法(针对数组),arr.forEach(function (value,index) 参数第一个是元素值,第二个是下标; each是jquery中的方法(针对jquery对象,即())。())。( ) )。 (‘li’).each(function(index,value){})参数第一个是下标,第二个是元素值;var arr = ['aa', 'bb', 'c...原创 2020-05-03 09:51:24 · 117 阅读 · 0 评论 -
Javascript 执行环境
执行环境JavaScript的解释器每次开始执行一个函数时,都会为那个函数创建一个执行环境(execution context),执行环境决定了变量的生命周期,以及哪一部分代码可以访问其中的变量。JavaScript中主要存在的两种执行环境:1.全局执行环境JavaScript代码运行起来会首先进入该环境,通常被默认为window对象,所有的全局变量和函数都作为window对象的属性...原创 2020-05-03 09:32:32 · 191 阅读 · 0 评论 -
JQuery $.each与$().each区别, for in 与 for of 区别
1. .each()]与.each()]与.each()]与().each()区别.each用于遍历数组、对象、数组对象,代码形式(arr,function(index,value))或(obj,function(key,value)).each用于遍历数组、对象、数组对象,代码形式(arr,function(index,value))或(obj,function(key,value)).ea...原创 2020-05-03 09:52:27 · 86 阅读 · 0 评论 -
鼠标事件有哪些?
出处:http://www.cnblogs.com/starof/p/4106904.html一、事件事件是javaScript和DOM之间交互的桥梁。你若触发,我便执行——事件发生,调用它的处理函数执行相应的JavaScript代码给出响应。典型的例子有:页面加载完毕触发load事件;用户单击元素,触发click事件。二、事件流1.事件流 问题:单击页面元素,什...转载 2018-09-24 15:20:35 · 3243 阅读 · 0 评论 -
this
this是js中的一个关键字,函数运行时自动生成的一个内部对象,只能在函数内部使用。我们要讨论的是 this 的指向。this的指向在函数创建的时候是决定不了的,在调用的时候才能决定,谁调用的就指向谁,this永远指向的是最后调用它的对象实例1:function a(){ var user = "追梦子"; console.log(this.user); //unde...转载 2019-10-29 07:14:56 · 96 阅读 · 0 评论 -
事件属性
event.preventDefaule() 该方法的作用是阻止默认的事件行为<form action="1.html"> 用户名:<input type="text" id="uname" /> <input type="submit" value="提交" id="sub"/></form><script> $...原创 2020-05-03 09:39:14 · 233 阅读 · 0 评论 -
原生DOM对象与jQuery对象转换
原生DOM对象转jQuery对象:var box = document.getElementById('box');var $box = $(box);jQuery对象转原生DOM对象:var $box = $('#box');var box1 = $box[0];var box2 = $box.get(0);...原创 2018-09-14 21:55:30 · 177 阅读 · 0 评论 -
函数有New和没New的区别
不实用new,也就是普通的函数调用而已,所以若是函数本身没有返回值,普通的函数调用没有什么意义 如: var person=new Person();//person是一个对象 var person = Person();//这只是一次普通的函数调用并赋值而已。...原创 2018-09-14 10:46:26 · 1554 阅读 · 1 评论 -
事件模型
一、事件模型是什么浏览器的事件模型,就是通过监听事件执行对应的监听函数。JS绑定事件监听有三种方法:html的on属性 【on+事件名】的方法绑定<script> el.setAttribute('onclick','doSomething()'); //等同于<Element onclick = "doSomething()"> </s...原创 2020-05-03 09:38:13 · 646 阅读 · 0 评论 -
类
类是什么,有哪些特性类是对象的模板,定义了同一组对象共有的属性和方法,通过类模版可以生产出无数个一样的对象,而不用一次次声明去定义。类的三大特性:类的公有、私有、静态方法/属性: function class1(){ this.name="world";//公有属性 var message="No Messages!";//私...原创 2020-05-03 09:39:56 · 98 阅读 · 0 评论 -
判断JavaScript脚本运行在浏览器还是node.js环境中
判断JavaScript脚本运行在浏览器还是node.js环境中this === window ? 'browser' : 'node';通过判断Global对象是否为window,如果不为window,则当前脚本运行在node.js环境中。...转载 2020-05-03 09:58:05 · 1925 阅读 · 0 评论 -
js中new函数后带括号和不带括号的区别
用new创建构造函数的实例时,通常情况下new 的构造函数后面需要带括号(譬如:new Parent())。 有些情况下new的构造函数后带括号和不带括号的情况一致,譬如:function Parent(){ this.num = 1;}console.log(new Parent());//输出Parent对象:{num:1}console.log(new Parent);...原创 2018-09-16 20:27:19 · 732 阅读 · 0 评论 -
执行环境
执行环境执行环境(execution context)决定了变量(变量,对象和函数)的生命周期,以及哪一部分代码可以访问其中的变量。。每一个执行环境都有一个对应的变量对象,环境中定义的所有变量和函数都保存在这个对象中(但这个变量对象我们无法直接使用)。JavaScript中主要存在的两种执行环境:1.全局执行环境JavaScript代码运行起来会首先进入该环境,通常被默认为wind...原创 2020-05-03 09:56:53 · 308 阅读 · 0 评论 -
JS 数组对象升降序
方法一:var newList = [ {name: "Bruce", age: 23, id: 16, score: 80,time:'2017-02-30'}, {name: "Alice", age: 24, id: 12, score: 90,time:'2014-07-10'}, {name: "David", age: 21, id: 11, score: 70,time:'2...原创 2020-05-03 09:37:20 · 258 阅读 · 0 评论 -
JavaScript 基础
函数赋值有括号和没括号的区别 function init() { var name = &amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;quot;Mozilla&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;quot;; // name 是一个被 init 创建的局部变量 function displayName() { // displayName() 是内部函数,一原创 2018-09-14 22:28:02 · 85 阅读 · 0 评论 -
Object.defineProperty()
对象属性的定义与赋值的方法:obj.prop =valueobj[‘prop’]=valueObject.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回此对象Object.defineProperty(obj, prop, desc)// obj 需要定义属性的当前对象// prop 属性名// desc 属性值javacript 有三种类型的属性命名数据属性:拥有一个确定的值的属性。这也是最常见的属性命名访问器属性:通过g转载 2021-05-07 20:14:04 · 91 阅读 · 0 评论 -
NProgress进度条插件
NProgress是页面加载是进度条插件安装:NPM安装npm install --save nprogressYarn安装yarn add nprogress引入:直接引入:<script src='nprogress.js'></script><link rel='stylesheet' href='nprogress.css'/>使用:NProgress.start(); // 开启进度条NProgress.done(); // .原创 2021-04-29 11:14:29 · 210 阅读 · 0 评论 -
Js运算出现多位小数
js浮点数运算莫名出现多位小数例如:console.log(0.1+0.2)//0.30000000000000004console.log(0.1*0.2)//0.020000000000000004console.log(0.1*3)//0.30000000000000004console.log(1.2/3)//0.39999999999999997---能整除的除法原因:JavaScript中计算小数运算时,都会先将十进制的小数换算到对应的二进制,一部分小数并不能完整的换算为二进制,原创 2021-04-20 20:54:44 · 446 阅读 · 0 评论 -
宏任务微任务执行顺序
JS事件循环基础:宏任务:setTimeout(() => { console.log("setTimeout新的宏任务");}, 0);new Promise(resolve => { resolve(); console.log("promise主线程任务");}).then(value => console.log("resolve微任务"));console.log("主线程任务");执行顺序:Promise里面的任务 console.log("pr原创 2021-04-10 16:47:09 · 207 阅读 · 0 评论 -
深拷贝和浅拷贝的区别
在讲深拷贝和浅拷贝之前要先了解一下不同数据类型的存储方式数据的存储方式数据分为基本数据类型(String, Number, Boolean, Null, Undefined,Symbol)和引用数据类型(Object, Array)基本数据类型存储:数据直接存储在栈中引用数据类型的存储:真实的数据存放在堆内存里,在栈中存储的是对象的指针浅拷贝与深拷贝浅拷贝与深拷贝是针对引用类型值的拷贝浅拷贝:仅仅复制对象的引用,而不是对象本身,新旧对象还是共享同一块内存,深拷贝:将对象完整地拷贝出来,开辟新转载 2021-03-27 10:39:26 · 295 阅读 · 0 评论 -
JS常用数组方法整理
数组是什么使用单独的变量名来存储一系列的值跟对象区别:数组是以数字为索引,是一种特别的对象,typeof返回Object对象是属性名为索引创建数组4种方法//构造函数let arr = new Array(1,2,3,4,5) // 创建新数组为 [1,2,3,4,5]// 字面量let arr = ["a","b","c"......'n']let arr = [] arr.length = 4 //创建一个长度为4的数组, 元素值为undefined// Array.ofA原创 2021-03-26 22:10:59 · 146 阅读 · 0 评论 -
JS计算脚本执行时间
方法一:const start = Date.now()for(let i = 0; i < 200000; i++) {}const end = Date.now()console.log((end-start)/1000 + '秒')方法二:console.time("timer名字")// 其他脚本for(let i = 0; i < 200000; i++) {}console.timeEnd("timer名字")输出:timer名字:毫秒数...原创 2021-03-18 00:01:23 · 726 阅读 · 0 评论 -
日期对象与时间戳转换, 日期格式化封装
日期对象转时间戳6种方式let date = new Date()date.getTime() // 精确到毫秒date.valueOf() // 精确到毫秒date*1 // 精确到毫秒 运算符把对象转为数字Number(date) // 精确到毫秒 直接类型转换Date.parse(date) // 精确到秒Date.now() // 获取当前时间的时间戳获取标准时间4传参方式const date1 = new Date('1990-12-01 13:10:30')const原创 2021-03-17 23:53:33 · 425 阅读 · 0 评论 -
JS获取任意范围内随机数
Math.random() [0-1)之间的随机数取 [n, m) 范围的随机数:Math.Floor(Math.Random()*(m - n)) + n取 [min, max] 、 (min, max)、 (min, max] 够可以转换为 [n, m) 这种个格式再计算:[min, max] =》 [min, max+1)(min, max) =》 [min+1, max)(min, max] =》 [min+1, max+1)...原创 2021-03-17 21:12:50 · 395 阅读 · 0 评论 -
innerHTML与innerText区别
功能介绍:innerHTML: 设置或获取元素内的所有子节点(包括标签、注释和文本节点)outerHTML: 设置或获取元素及所有子节点(包括标签、注释和文本节点)innerText:获取元素的文本,会过滤掉所以标签,将文档树中的所有文本拼接起来设置时会把元素所以子节点都删除再重写利用这一点,可以通过 innerText 属性过滤掉 HTML 标签div.innerText = div.innerText;outerText 读取时与 innerText 完全一样,写入时会替换整个元原创 2021-03-17 11:53:13 · 1335 阅读 · 0 评论 -
Js 数据类型的判断(typeof、instanceof、constructor、 Object.prototype.toString.call)
JS的数据类型js数据类型:基本据类型和引用数据类型。基本数据类型有:String、Number、boolean、null、undefined引用数据类型有:object(里面包含的 function、Array、Date)JS数据类型判断方式typeof 输出分别是什么console.log(typeof 2); // numberconsole.log(typeof NAN); // number NAN 是Number 中的特原创 2021-03-16 20:35:09 · 132 阅读 · 0 评论 -
if else 和 switch 的区别和选择
if else 和 switch 的选择switch 一般用于单一条件的判断if 一般用于连续区间值判断,复杂的多条件判断,或者动态表达式判断if 和 switch 都可以设计多重分支结构,一般情况下 switch 执行效率要高于 if 语句,代码可读性也高,如果能够使用switch结构,就不要选择if结构。无论是使用if还是使用switch结构,应该确保下面3个目标的基本实现:准确表现事物内在的、固有的逻辑关系。不能为了结构而破坏事物的逻辑关系。优化逻辑的执行效率。执行效率是程序设计的重要目原创 2021-03-16 19:34:07 · 1461 阅读 · 0 评论 -
JS数组迭代( forEach、map、reduce、 filter、some、 every、find)
1. forEach(循环)forEach 循环在所有元素调用完毕之前是不能停止的,它没有 break 语句可用 try catch 语句,就是在要强制退出的时候,抛出一个 error 给 catch 捕捉到,然后在 catch 里面 return,这样就能中止循环了forEach 循环可以修改原来的数组let arr = [1,2,3];arr.forEach(function(val,index){ console.log(val,index)})// 1 0// 2 1// 3原创 2021-03-16 16:44:10 · 270 阅读 · 0 评论 -
常用正则表达式整理
简单校验手机号/^1\d{10}$/.test(mobile) // 简单校验手机号 以1开头11位数字/^((13[0-9])|(15[^4])|(18[0-9])|(17[0-8])|(147)|(166)|(198)|(199))\d{8}$/.test(mobile) //严格校验手机号简单校验生份证/^([1-9]\d{5}[12]\d{3}(0[1-9]|1[012])(0[1-9]|[12][0-9]|3[01])\d{3}[0-9xX])$/.test(idCard)第一位原创 2021-03-16 09:46:13 · 182 阅读 · 0 评论 -
JS中的循环 for、while、do-while、for in 、 for of
循环结构的执行步骤声明循环变量;判断循环条件;执行循环体;更新循环变量;然后循环执行2-4,直到条件不成立,跳出循环。1. for循环for(初始化①;条件②;自增③){ 循环体④}三个表达式:①声明循环变量;②判断循环条件;③更新循环变量三个表达式都可以有多部分组成,第二部分多个判断条件用&& ||连接,第一三部分用逗号分割执行特点:先判断再执行执行顺序: 初始化① 》 判断② 》 执行循环体④ 》 自增③ , ②④③ ②④③… …直到②为假结束主要用原创 2021-03-15 18:19:55 · 206 阅读 · 1 评论 -
++ i 和 i++区别
++n 先自增再运算n++ 先运算再自增var a, i = 10;a = i ++; //这里i要先赋值,再自加。语句执行后a=10, i = 11;a = ++i; //这里i要先自加,再赋值。语句执行后a=11, i = 11;let i = 9;while( i ++ < 10){console.log(i)}; // 9 ;先执行逻辑逻辑运算,再自增 i = 9 》 i< 10 》i++ 》i =10while(++ i < 10){console.lo原创 2021-03-13 23:06:58 · 7738 阅读 · 2 评论 -
var let const 声明变量区别
var let 声明变量异同-varlet变量提升创建和初始化都被提升, 可以重复声明创建过程被提升,初始化没有提升, 不能重复声明预解析与执行过程预解析时创建 ,初始化为undefined,执行时赋值为声明的值预解析时创建,执行是初始化为声明的值声明之前使用undefined块级顶部形成临时行死区, 声明前使用会报错作用域函数作用域块级作用域全局变量挂载位置声明的全局变量挂在window下声明的全局变量挂载在块级作用域script下面原创 2021-03-13 22:25:45 · 111 阅读 · 0 评论