JavaScript
深海有鱼呀
永远年轻,永远热泪盈眶
展开
-
compose函数实现函数调用扁平化
let fn1 = function (x) { return x + 10; }; let fn2 = function (x) { return x * 10; }; let fn3 = function (x) { return x / 10; }; console.log(fn3(fn1(fn2(fn1(5))))); //=> ((5+10)*10+10)/10 => 16 编写compose函数实现调用扁平化 funct..原创 2021-01-06 10:25:35 · 106 阅读 · 0 评论 -
柯里化函数思想
柯里化这个词一看就感觉高大上,实际当你了解后才发现其实就是高阶函数的一个特殊用法柯里化是什么?柯里化 Currying ,就是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数,并且返回接受余下的参数而且返回结果的新函数的技术。做个简单示例:// 普通的add函数function add(x, y) { return x + y}// Currying后function curryingAdd(x) { return function (y) {.原创 2021-01-04 15:18:34 · 147 阅读 · 0 评论 -
单例设计模式
单例模式:创建一个命名空间(模块名)接收返回的相关信息,实现把信息(方法…)暴露给别的模块使用let module = (function(){ let name = '哈哈' function query(){ console.log('这是一个方法') } funciton fn(){ console.log('fn') } window.query=query // 挂载在window对象上,给别的模块使用,但是挂载的比较多后也可能出现问题 // 优化原创 2021-01-04 14:48:52 · 52 阅读 · 0 评论 -
惰性函数
JS惰性函数,是针对优化频繁使用的函数。常用于函数库的编写、单例模式之中。应用:添加绑定事件(原版)function addEvent(dom, type, handle){ if(dom.addEventListener){ dom.addEventListener(type, handler, false); }else{ dom.attachEvent('on' + type, handler); }}但是每一次都要对浏览器的判断,可原创 2021-01-04 14:46:36 · 606 阅读 · 0 评论 -
日期对象的基本操作
// 不足10位补0 function addZero(val){ val = Number(val) return val < 10 ? '0' + val : val } // 获取当前时间的详细时间 function getDate(){ let time = new Date() year = time.getFullYear(), month = time.getMonth() + 1, day = time.getDate(), w...原创 2020-12-17 15:35:05 · 90 阅读 · 0 评论 -
数组及数组中常用的方法
数组是对象类型的,它属于特殊的对象数组中常用方法方法的作用和含义方法的实参(类型和含义)方法的返回值原来的数组是否发生改变1.实现数组的增删改的方法这一部分方法都会修改原有的数组pushpush: 向数组末尾增加内容@params(参数) 多个任意类型 @return 新增后数组的长度unshiftunshift: 向数组开始位置增加内容@pa...原创 2020-12-17 14:04:00 · 711 阅读 · 0 评论 -
字符串的常用方法
截取slice(start,end) : 返回字符串中提取的子字符串(不包括 end 处的字符)start,end 为索引可以是负数,-1 指字符串的最后一个字符,-2 指倒数第二个字符,以此类推。var str="Hello World";var str1=str.slice(2); //如果只有一个参数,则提取开始下标到结尾处的所有字符串var str2=str.slice(2,7); //两个参数,提取下标为2,到下标为7但不包含下标为7的字符串var str3=str.slice原创 2020-08-29 23:41:40 · 130 阅读 · 0 评论 -
内存泄露和内存溢出
内存溢出: 指程序在申请内存时,没有足够的内存空间供其使用。一种程序运行出现的错误,当程序运行需要的内存超过了剩余内存时,就会跑出内存溢出的错误。内存泄露:指程序在申请内存后,无法释放已申请的内存空间,导致一直占用着改内存单元,一次内存泄露危害可以忽略,但是内存泄露堆积后果很严重,无论多少内存,迟早被占光。内存泄露的危害: 1、导致系统中可用的内存越来越少。直到所有的可用内存用完最后导致系统无...原创 2020-06-19 16:28:33 · 128 阅读 · 0 评论 -
前端模块化详解
先解释一下模块化概念<link rel="stylesheet" href="css/base.css"> <script src="js/swiper.min.js"></script> 模块化:js天生不支持模块化,简单来说就是不能在一个js文件中引入另一个js文件。但由于js文件越来越来越大,很不方便,一些大神自己编写js底层文件让其...原创 2020-06-19 16:18:00 · 244 阅读 · 0 评论 -
URL?号传参的编码处理
原创 2020-08-17 23:08:57 · 193 阅读 · 0 评论 -
AJAX请求
Ajax发送请求和接受结果要使用一个对象—》XMLHttpRequest创建xhr对象let xhr = nullif(){ xhr=new XMLHttpRequest();}else { xhr=new ActiveXObject('Msxml2.XMLHTTP')}发送请求使用到两个方法准备请求:open([get/post],[url],[true/false...原创 2020-06-19 16:26:45 · 79 阅读 · 0 评论 -
axios在vue中使用的方法
安装axios方法一:使用默认实例main.js 中导入:import axios from ‘axios’挂载在Vue的原型对象上,在全局可以使用 Vue.prototype.axios=axios方法二:提取axios封装,使用自己的实例// axios.jsimport axios from ‘axios’const instance=axios.create({...原创 2020-06-19 16:57:36 · 139 阅读 · 0 评论 -
arr.reduce()
arr.reduce()方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。arr.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])callback:行数组中每个值的函数,包含四个参数;initialValue:初始值accumulator:累计器累计回调的返回值; 它是上一次调用回调时返回的累积值,或initialValuecurrentValue:数组中原创 2020-08-13 16:56:24 · 1401 阅读 · 0 评论 -
箭头函数
箭头函数特点没有 this arguments prototype,没有就向上级作用域找let a = 100; // 此属性不会放到全局上let obj = { a:1, fn:()=>{ // this => obj 没有this指向从而解决了this问题 setTimeout(()=>{ console.log(this.a); }) }}obj.fn(); // undefin原创 2020-08-13 15:46:04 · 57 阅读 · 0 评论 -
装饰器
装饰器 装饰模式 ,在执行类之前可以进行包装注意:只能装饰类装饰器 必须是一个函数,只能修饰类 (类中的属性 还有类中的方法) 参数分别是 类的原型 装饰的key 和key对应的属性描述器原创 2020-08-13 14:10:25 · 88 阅读 · 0 评论 -
localStorage、sessionStorage、Cookie
localStorage用于长久保存整个网站的数据,保存的数据没有过期时间,直到手动去除sessionStoragesessionStorage 用于临时保存同一窗口(或标签页)的数据,有效期:在关闭窗口或标签页或浏览器之后将会删除这些数据(只要浏览器保持打开,页面刷新和重载都会保持 sessionStorage 内容)刷新当前页面,或者通过location.href、wi...原创 2020-06-19 16:20:52 · 74 阅读 · 0 评论 -
class(类)
es5中没有类,我们是用构造函数来模拟类缺点:es5中的类可以当做函数来调用,es6不行属性:1、实例上的属性 2、公共属性对象有自己的属性,属性的属性值可以为任何的内容,当属性值为函数的时候,我们称之为方法。当属性质为对象的时候,称之为子对象使用构造函数模拟类function Animal(){ if(!(this instanceof Animal)){ // 当前是不是通过new来调用的 throw new Error('NOT NEW') }原创 2020-08-12 17:18:29 · 297 阅读 · 0 评论 -
es6模块化
es6模块化怎么使用es6模块 ?esModule模块 (es6) 和 commonjs模块 (node模块)— es6(静态导入:不能在作用域中导入)import…from …导入import …有副作用的导入(可以让文件执行 但是没有使用这个文件中的内容)export—导出export default–导出具体值 每个文件都是一个模块— commonjs模块(动态导入)可以在作用域中导入,例:if(…){ require(XXXX)}import--导入 export---导原创 2020-08-12 14:09:39 · 92 阅读 · 0 评论 -
defineProperty和Proxy、Reflect、Symbol
Object.defineProperty()get:一个给属性提供getter的方法,如果没有getter则为undefined。该方法返回值被用作属性值。默认为undefined。set:一个给属性提供setter的方法,如果没有setter则为undefined。该方法将接受唯一参数,并将该参数的新值分配给该属性。默认值为undefined。let obj = { _a:'', get a(){ // todo ... return this.原创 2020-08-12 12:57:06 · 254 阅读 · 0 评论 -
ES6常用方法
1、 … 扩展运算符(解构赋值)原创 2020-08-08 16:24:00 · 524 阅读 · 0 评论 -
浅拷贝和深拷贝
浅拷贝:只能拷贝第一层,如果是多层嵌套还是跟着原来数据改变深拷贝:拷贝出来的结果和以前没关系浅拷贝1、for···in只循环第一层// 只复制第一层的浅拷贝function simpleCopy(obj1) { var obj2 = Array.isArray(obj1) ? [] : {}; for (let i in obj1) { obj2[i] = obj1[i]; } return obj2;}var obj1 = { a: 1, b: 2,原创 2020-08-08 15:43:27 · 114 阅读 · 1 评论 -
JS中的操作语句:判断、循环
判断条件成立做什么?不成立做什么?if/else if/else if三元运算符switch case1、if/else if/else if2、三元运算符3、switch case循环重复做某些事情就是循环for循环for in循环for of循环(ES6新增)while循环do while循环...原创 2020-03-12 13:30:01 · 254 阅读 · 0 评论 -
slice、splice、concat操作后数组的变化
一、splice() 用于插入 删除 替换(会改变原始数组)1、参数至少两个(index,number,item…,item)index:开始的下标 必须的number:要删除的数量,如果是0就不删除,必须的item:添加的元素var fruits = ["Banana", "Orange", "Apple", "Mango"];fruits.splice(2,0,"Lemon","Kiwi");结果:Banana,Orange,Lemon,Kiwi,Apple,Mango2、会改转载 2020-07-24 14:26:08 · 1756 阅读 · 0 评论 -
数组遍历方法集合
for 循环可以改变原数组,而forEach和map相当于把原数组进行浅拷贝进行遍历,不能改变原数组的每一项,但是原数组中某一项是引用类型的话可以改变其内的值。for循环var arr = [1,2,4,6]for(var i = 0;i < arr.length; i++){ console.log(arr[i])}forEach 语句遍历数组中的每一项,没有返回值,对原数组没有影响,不支持IEvar arr = [1,5,8,9]arr.forEach(funct.原创 2020-07-03 11:52:00 · 137 阅读 · 0 评论 -
数据类型转换以及==比较
把其他数据类型转换为Number类型/* * 把其他数据类型转换为Number类型 * 1.特定需要转换为Number的 * + Number([val]) * + parseInt/parseFloat([val]) * 2.隐式转换(浏览器内部默认要先转换为Number在进行计算的) * + isNaN([val]) * + 数学运算(特殊情况:+在出现字符串的情况下不是数学运算,是字符串拼接) * + 在==原创 2020-06-22 15:56:33 · 259 阅读 · 0 评论 -
js排序sort()
排序sort()默认按照首字母AZ、az排序,以及0~9排序。① 函数传参(a-b)-升序、降序排序② 进阶:函数嵌套传参(自定义函数(属性名))③ 字母排序兼容sort()原理与通用方法sort()通用方法①通用简单升序② 通用简单降序sort()通用排序原理排序假设有一个对象数组,我们想要根据某个对象属性对数组进行排序。我们可以使用sort()方法sort()so...原创 2020-06-19 16:50:51 · 320 阅读 · 0 评论 -
export和export default
export 的方式 (用于导出多个) 导入用{ }export default (当前文件只有这一个) 引入方式 import printMe from ‘./print.js’;bordered {&.float {float: left;}.top {margin: 5px;}}等同于:.bordered.float {float: left;}.b...原创 2020-06-19 16:47:31 · 77 阅读 · 0 评论 -
let、var、const的区别和变量提升
变量提升在当前执行上下文代码执行之前,首先会把带有var或者function关键字的声明或者定义(带var的只会提前声明,带function会提前声明+定义(赋值))var和let的区别1、var:有变量提升let:没有变量提升2、在全局执行上下文中用var声明一个变量,也会给全局对象GO中(window)增加一个对应的属性;但是用let声明的变量不存在这个特点;注:3、带v...原创 2020-04-23 01:29:00 · 252 阅读 · 0 评论 -
闭包
闭包函数执行形成一个全新的执行上下文,进栈执行后所创建的一些变量被外部所引用,不能出栈销毁,就形成了闭包。作用:延长了局部变量的生命周期,保护全不被污染缺点:函数不能被出栈销毁,频繁使用会造成内存泄漏问题。解决方法:手动销毁 fn=null...原创 2020-04-19 18:04:44 · 102 阅读 · 0 评论 -
作用域和作用域链
作用域作用域也就是创建函数时当前执行上下文存储变量的地方(VO/AO)作用域链变量取值的过程,先在自己执行上下文中的变量对象中找看是否是自己AO中的私有变量,找不到就去上级作用域查找,有则停止,无就继续,一直找到全局作用域。...原创 2020-04-15 03:00:58 · 106 阅读 · 0 评论 -
函数的底层执行机制
浏览器想要执行js代码,就会从电脑中分配出一块内存执行代码(栈内存)每一次函数执行都会开辟一个全新的私有栈内存(所以函数内部的变量不能被外部访问,只能return出去)...原创 2020-04-06 21:45:20 · 221 阅读 · 0 评论 -
i++和++i详细知识
原创 2020-03-19 20:06:43 · 93 阅读 · 0 评论 -
js数据引用数据类型-函数的基础概念
函数 function函数就是一个方法或者一个功能体,函数就是把实现某个功能的代码放到一起进行分装,以后想要操作实现这个功能,只需要把函数执行即可 =>“分装”:减少页面中的冗余代码,提高代码重复使用率(低耦合高内聚)创建函数形参返回值执行函数实参arguments函数底层运行机制…创建函数es5方式匿名函数...原创 2020-03-13 13:54:58 · 148 阅读 · 0 评论 -
元素对象的深一层理解
思考为什么不可以改?原创 2020-03-12 17:24:30 · 78 阅读 · 0 评论 -
JS数据类型检测
JS中的数据类型检测typeof[val] : 用来检测数据类型的运算符面试题: 自右向左检测instanceof : 用来检测当前实例是否率属于某个类constructor : 基于构造函数检测数据类型(也是基于类的方式)Object.prototype.toString.call() : 检测数据类型最好的办法...原创 2020-03-11 19:30:31 · 163 阅读 · 0 评论 -
js数据类型的区别(堆栈底层机制)
一个变量只能关联一个值,修改变量也就是让变量重新指向一个值阿里面试题let a={n:1}let b=a;a.x=a={n:2}console.log(a.x)console.log(b)重点:赋值语句的执行顺序是从右至左a.x=a={n:2}就相当于 a.x={n:2} a={n:2}例: var a = b = 10;var a = b = 10; 就...原创 2020-03-11 19:30:06 · 199 阅读 · 0 评论 -
js数据引用数据类型-Object对象数据类型
Object对象数据类型-普通对象![在这里插入图片描述](https://img-blog.csdnimg.cn/20200311150042734.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjA2OTE0...原创 2020-03-11 19:29:47 · 282 阅读 · 0 评论 -
js数据基本数据类型-Boolean(布尔数据类型)、null、undefined详解
Boolean 布尔数据类型只有两个值 true/false把其它类型值转换成布尔类型只有0、NaN 、null、’’、undefined 五个值转换为false,其余都转换为true(而且没有任何的特殊情况)Boolean()!/!!条件判断null、undefinednull和undefined都是代表是没有null:意料之中(一般都是开始不知道值,我们手...原创 2020-03-11 19:29:28 · 1095 阅读 · 0 评论 -
js数据基本数据类型-string(字符串类型)详解
string字符串数据类型所有用单引号、双引号、反引号( ES6模板字符串)包起来的都是字符串把其他类型值转换成字符串[val].toString()字符串拼接原创 2020-03-11 19:29:15 · 736 阅读 · 0 评论 -
js数据基本数据类型-Number(数字类型)详解
number数字类型包含:常规数字、NaNNaNnot a number: 非数字 不是一个数,但它率属于数字类型NaN和任何值(包括自己)都不相等:NaN!=NaN,所以我们能用相等的方式判断是否为有效数字isNaN检测一个值是否为非有效数字,如果不是有效数字返回true,反之是有效数字返回false在使用isNaN进行检测的时候,首先会验证检测的值是否为数字类型,如果...原创 2020-03-11 19:28:55 · 3765 阅读 · 0 评论