JavaScript
文章平均质量分 65
努力学习前端的77
如果文章对你有帮助或有什么差错,请点赞或留言告知
你走的每一步路都算数,保持学习热情能获得最易得的幸福感
展开
-
聊聊V8引擎
V8 是什么 V8 是 Google 开源的 JavaScript 引擎。可以理解为:V8 将程序员写的代码,最终解析成机器码能够让计算机识别。其中的具体操作,就是 V8 干的事。 我们把 V8 看成一个黑盒, 程序语言进去,通过黑盒子的处理,经过一系列操作后,解析成机器码。【V8被广泛用于各种JavaScript执行环境。】 了解V8,对于性能优化的思考会有更多理解和方向。能够更轻松理解babel语法分析原理,eslint语法检查机制,前端框架的底层实现。V8的发展第一个版本的特点:由 Ja原创 2022-04-14 23:03:15 · 3657 阅读 · 1 评论 -
模块化开发
模块化开发CommonJS 的导入导出方式ES6的模块化Modules为什么前端要做模块化开发避免多人开发时变量重名等问题模块化开发的概念早期的模块化开发的实现,是通过匿名函数,使得多人开发时变量重名不会影响整体项目。同时将需要全局使用的变量或者函数通过return方式暴露出去–导出。这样就可以在其他位置直接使用–导入。常见的模块化规范有:CommonJS, AMD, CMD, ES6的Modules模块化开发的最关键两步骤就是导出和导入。CommonJS 的导入导出方式E原创 2020-11-03 13:48:45 · 153 阅读 · 2 评论 -
【ES6】Promise
Promise是ES6引入的语法。链式编程。异步编程的解决方案。—网络请求的情况下容易用到异步编程。//Promise使得请求获取和数据操作分开。即分离读写,可以减少重绘回流new Promise((resolve,reject) => { //异步操作 一般这里用来进行异步的网络请求 setTimeout(() => { //异步请求成功时调用resolve回调,然后会去执行then() //resolve('well done') //异步请求失败是调用rejec原创 2020-11-25 14:42:36 · 110 阅读 · 0 评论 -
函数式编程与 JS 异步编程、手写 Promise> IO函子问题
学习笔记函数式编程与面向对象编程的区别:函数式编程将事物与事物之间的逻辑关系抽象成函数映射关系。函数可以独立存在,可以作为参数,作为返回值,作为变量。通过函数式编程避免了this的复杂作用域问题。而面向对象编程是将万物抽象为对象,事物之间的联系和属性都成为对象的属性值,所以逻辑关系需要依托对象的关系来访问或者实现。什么是一等公民:就是可以作为变量,作为返回值,作为传入的参数的东西。函数就是一等公民高阶函数:高阶函数即:函数作为参数传入,函数作为返回值闭包:闭包就是,在函数内部,返回了原创 2021-07-14 15:02:57 · 230 阅读 · 2 评论 -
前端问题收集
css3如何实现鼠标悬浮时,出现音效vue <template> <button :class="$style.button" /></template>原创 2020-04-24 10:18:51 · 154 阅读 · 1 评论 -
js 构造函数的理解 原型和原型链的理解
视频地址:讲的很详细function Person(name,age) {//构造函数与普通函数最大的区别是调用方式的不同,通过new关键字调用。构造函数一般使用大写。 this.name = name; this.myfunc = func;}function func() {//因为每创建一个实例对象都会分配一块内存空间,如果将函数定义在构造函数内,那么有多少个实例就会创建多少个函数。所以将func写在全局 console.log('大家好,我是:'+this.name);//this指向原创 2021-06-22 16:00:23 · 75 阅读 · 0 评论 -
js reduce函数
reduce 方法参考:reduce() 方法对数组中的每个元素执行一个由开发者自己提供的函数,将其结果汇总为单个返回值。可以理解为,reduce会遍历数组元素,将每个元素都作为参数,代入自定义函数执行并返回一个返回值。并在下一次执行时将返回值作为参数传入。const arr = [1, 2, 3, 4]// 求数组元素值的总和//let total = arr.reduce((sum , item) => {// return sum + item//},0)const f原创 2021-06-22 11:27:26 · 4576 阅读 · 0 评论 -
原型和原型链
8,原型和原型链1,每个函数都有一个prototype,即显示原型。默认指向一个空的Object对象。【但是Object函数的显示原型不指向空对象而是null】2,每个实例对象都有一个__proto__,隐式原型。【左右分别是两条下划线】3,【实例对象的隐式原型的值为其对应的构造函数的显示原型的值】。【即Fn.prototype === fn.__proto__】4,开发者可以直接操作显示原型,【ES6之前】不能直接操作隐式原型。function Fn() {}console.log(Fn原创 2021-04-07 14:28:28 · 152 阅读 · 2 评论 -
【javascript】数据-变量-内存 浅拷贝
关于赋值与内存的问题:存储的值类型的判断存储的值类型的判断:var a = xxx;//1,xxx表示基本数据: 比如var a = 3//a内存中保存的就是数据xxx本身//2,xxx表示对象/数组/函数://a内存中保存的就是指针地址//3,xxx表示变量: //比如: var b = 'www'; a = b; a内存中保存的是'www';//再比如: var b = {}; a = b; a内存中保存的是指针地址;//a内存中保存的都是xxx的内容关原创 2021-03-31 15:45:06 · 83 阅读 · 0 评论 -
[JAVASCRIPT] 进阶知识巩固
javascript进阶知识巩固基础总结:数据类型1,数据类型2,变量类型: 【变量内存之的类型】判断:undefined和null的区别:数据-变量-内存对象函数-回调函数高级面向对象高级线程机制与事件机制this闭包作用域和作用域链基础总结:数据类型1,数据类型1.1. 基本类型:StringNumberBooleanundefinedNull1.2.对象类型:2,变量类型: 【变量内存之的类型】2.1.基本类型:保存的就是基本类型的数据2.2.引用类型:保存的引用地址原创 2021-03-26 15:34:15 · 96 阅读 · 0 评论 -
javascript系统学习【巩固】
参考视频视频配套文档视频配套代码提升效率:1,vscode插件:Live Server :文件保存后自动刷新页面Browser Preview :可以在编辑器中打开页面https://blog.csdn.net/qq_44266521/article/details/109992934原创 2021-03-04 17:02:36 · 106 阅读 · 0 评论 -
键盘按钮keyCode大全
键盘按钮keycode原创 2021-01-07 16:10:32 · 207 阅读 · 0 评论 -
JS实现实现系统时间显示--动态显示秒和分
注:代码的思路是每隔一秒让获得的当前秒自增,并每隔一秒将新的秒数进行赋值。分钟是每隔60秒获取一次分钟,并给数据重新赋值。每刷新一次页面,在页面挂载完成时获得一次系统时间。精确到年月日周几和小时数。如果用户在当前页面24小时内都没有刷新过页面,系统时间的显示会有误差。因为它没有重新获取。直接上代码:<template> <span id="time"> <h3> {{ nowtime }} : {{ minutes }}原创 2020-09-01 15:27:57 · 1437 阅读 · 0 评论 -
es6 字符串的新方法includes() startsWith() endsWith() padStart() padEnd()
在ES6中给字符串提供了新方法includes():判断字符串中是否包含某个子串,返回布尔值if(v.includes(keyname)){}//判断字符串v是否包含子串keyname原创 2020-07-29 17:59:40 · 471 阅读 · 0 评论 -
js 聊聊console
console.log(alert(1));//先弹出1,再输出undefinedalert(alert(1));//先弹出1,再弹出undefinedalert(alert(1),alert(2));//先弹出1,再弹出2,再弹出undefined原创 2020-07-24 11:02:53 · 113 阅读 · 0 评论 -
js 对象的通俗易懂的理解 深拷贝
写在前面这里的笔记是在网易云课堂观看李游老师的前端视频整理的,在这里推荐一下李游老师的视频,通俗易懂,之前已经看过一些文档一直吃不透记不住。对象数据类型【Number,String,Boolean,Array等】都属于Object有句话说万物皆对象,可以这么理解它,所有的数据类型都属于对象Object,Obejct的公共方法和公共属性【通过Object.prototype.定义的属性或方法】,所有数据类型的对象都可以使用。但值得注意的是,“万物皆对象”这句话并不全对,因为字面量不属于对象。var原创 2020-07-23 17:42:45 · 234 阅读 · 0 评论 -
js 函数柯里化是什么,函数柯里化增加了函数的灵活性,减少了代码的重复性
柯里化的概念:当函数有多个参数的时候,调用一个函数只传递部分参数(这部分参数会固定不变),并返回一个新的函数,而新的函数传递剩余的参数,并返回结果 //硬编码 // 柯里化可以解决硬编码问题 function checkAge(age) { let min = 18;//硬编码 return age >= min; } //普通纯函数 function checkAg原创 2020-07-17 17:18:09 · 196 阅读 · 2 评论 -
js 纯函数是什么
纯函数的概念:相同的输入永远得到相同的输出.且没有任何可观察的副作用.比如一个加法函数.输入参数1,1 输出结果永远是2,这个加法函数就属于纯函数lodash是一个纯函数的功能库.提供了对数组,数字,对象,字符串,函数等操作的一些方法 // 数组方法slice(a,b) 从数组中截取下标(a,b]的字符串,不会改变原数组 // 数组方法splice(a,b) 从数组中的下标a位置开始截取b个元素,返回一个新数组.会改变原数组 let array = .原创 2020-07-17 17:13:37 · 836 阅读 · 0 评论 -
js 闭包函数的概念和作用和demo
正常情况下,当函数被调用完成后,函数的内部成员会释放掉闭包IIFE的概念:定义在函数内部的函数.闭包的特点:使用闭包会使得数据都保存在内存中,使得内存消耗很大,不能滥用闭包.闭包可以读取局部变量当函数外部对函数内部的成员有引用的时候,函数的内部成员就不会被释放.会被存储在内存中.即闭包中用到的数据会被存储在内存中。可以在另一个作用域中调用一个函数的内部函数并访问到该函数作用域中的成员 function makeFn1 () { let msg = 'he.原创 2020-07-17 17:03:56 · 122 阅读 · 0 评论 -
js 函数提升/预处理/预解析
预解析/预处理/函数提升的函数必须是function声明的函数,=赋值的函数不存在预处理: // // 函数提升 // f();//hello // g();//g is not a function // function f(){//用声明的方式声明的函数 // console.log('hello'); // } // var g = function(){//函数表达式 /原创 2020-07-17 16:57:42 · 131 阅读 · 0 评论 -
js 高阶函数的概念,用法,常用的高阶函数
高阶函数的意义:高阶函数用来抽象通用的问题,让我们只需要关注于目标,忽略细节;可以让函数变得灵活[比如filter函数中,fn就可以根据实际情况自定义.] // 面向过程的方式 let arr = [1,2,3]; for(let i = 0;i<arr.length;i++) { console.log(arr[i]); }; //高阶函数的方式:使用封装的函数,直接使用功能,省略具体的实现过程原创 2020-07-17 16:56:05 · 614 阅读 · 0 评论 -
js 函数是一等公民
1,函数可作为参数 // 1.1高阶函数----函数作为参数【函数作为参数:使函数变得更灵活--因为具体的函数内容可以在引用函数时定义】 function ff(array,fn) { for(let i = 0; i<array.length;i++) { fn(array[i]); } }; let arr = [1,2,3,5,6,7]; ff(ar原创 2020-07-17 16:51:01 · 218 阅读 · 0 评论 -
每日一题---【关于js的解析和执行过程/prototype】
知识储备:1.prototype:js中每个对象都有prototype属性;每个构造函数都有个属性叫原型;作用:用来返回对象类型原型的引用,为某个特定的类声明通用的变量或函数【即用来给相同类型的所有对象添加共享属性】2.构造函数/构造器3.实例对象4.作用域5.js的解析和执行过程:new Foo() 会去调用原型对象;new Foo则是去调用它的私有属性/函数6.变量提升,函数提升7.操作符优先级 // function a() { };原创 2020-07-15 16:10:19 · 118 阅读 · 0 评论 -
【javascript】数组的新方法 some() / every() / findIndex() / filter()
array.some(function(currentValue,index,arr),thisValue)some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。some() 方法会依次执行数组的每个元素:如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。如果没有满足条件的元素,则返回false。注意: some() 不会对空数组进行检测。注意: some() 不会改变原始数组。//html部分<p id="demo"></p&原创 2020-07-03 14:59:43 · 281 阅读 · 0 评论 -
javascript的全局函数 eval escape isNAN
eval(string) javascript的全局函数,返回字符串表达式中的值var str = "1+2+3+4";alert(eval(str));//10escape(string) javascript全局函数:对字符串编码,这样就可以在所有计算机上读取该字符串。该方法不会对 ASCII 字母和数字进行编码。也不会对这些 ASCII 标点符号进行编码:【 * @ ...原创 2020-04-03 14:10:00 · 165 阅读 · 0 评论 -
js匿名函数 执行插件代码时可使用
javascript匿名函数自执行 :(function(window,document,undefined){})(window,document);//简化成()(); 表示匿名函数自执行(function(window,document,undefined) { //此处window为局部变量, //do something console...原创 2020-04-03 15:24:07 · 81 阅读 · 0 评论 -
js闭包函数 获取局部变量时
函数内部声明变量的时候,一定要使用var/let命令。如果不用命令的话,实际上声明了一个全局变量!function f1(){ n=999; } f1(); alert(n); // 999子函数可以一层一层读取到父元素的变量,反之不行。假如需要得到函数的局部变量,正常操作是:在函数的内部再定义一个函数,该函数称之为闭包。闭包的作用:读取局部变量;让局部变量的值始...原创 2020-04-03 16:07:49 · 682 阅读 · 0 评论 -
javascript splice()
Array.splice(index,count) 直接对数组进行修改,会改变数据,返回的是删除后的新数据Array.splice(index,n,)删除数组中的指定元素,从数组下标index处开始,删除n个元素var Array = ['张三','李四','老王','麻花'];Array.splice(1,1);console.log(Array);//['张三','老王','麻花...原创 2020-04-10 13:34:17 · 211 阅读 · 0 评论 -
【JS】本地存储的几种方式-cookie,session,localStroage,WebStorage,sessionStorage
本地存储的集中方式cookie,session,localStroage,WebStorage,说说区别?使用场景?一、cookie和sessioncookie和session都是用来跟踪浏览器用户身份的会话方式。保持状态:cookie保存在浏览器端,session保存在服务器端cookie机制:如果不在浏览器中设置过期时间,cookie被保存在内存中,生命周期随浏览器的关闭而结束,这种cookie简称会话cookie。如果在浏览器中设置了cookie的过期时间,cookie被保存在硬盘中,关原创 2020-05-12 13:25:26 · 867 阅读 · 0 评论 -
如何规避javascript多人开发函数和变量重名问题。
在JS中是没有块级作用域的只有函数作用域。局部变量一般都会在函数结束后自动销毁释放出内存,而全局变量会直到进程结束才会被销毁。因此要尽量少的使用全局变量,尽可能使用局部变量,这不仅会减少变量重名的几率,更会减少内存开销。当我们需要一个作用域来关住变量时一般会用一个匿名函数来充当这个作用域。最有效的方法,还是采用面向对象开发。JS既然缺少作用域限制,那我们自己再给它人为加上一个作用域,并且保证每个作用域不重复,这个东西本身JS就有,那就是对象。(function(){ var gende原创 2020-05-12 13:40:58 · 2333 阅读 · 0 评论 -
前端----什么是内存泄漏?
什么是内存泄漏?参考来自简书内存是计算机中重要的部件之一,它是与CPU进行沟通的桥梁。计算机中所有程序的运行都是在内存中进行的,因此内存的性能对计算机的影响非常大。无用的对象占据着内存空间,使得实际可使用内存变小,形象地说法就是内存泄漏了。内存溢出(Out OfMemory):“你内存一共就剩1MB,非要存个1GB的数据,存小点不行吗?要不再加点内存空间好不好,还存,还存溢出了昂,一库一库~”内存泄漏(MemoryLeak):“你声明了一个又一个局部引用变量,都用完了还不让垃圾回收,空间都被原创 2020-05-25 13:16:08 · 773 阅读 · 0 评论 -
javascript基础知识强化篇---类,extends,super
通过class创建类,通过new创建实例。并通过构造函数给实例对象返回某些属性。类名首字母注意大写类的公共属性可以放在构造函数中。这样每创建一个类的实例对象,每个对象都会自动去调用构造函数并获取到对象的公共属性。在类中添加公共方法,直接方法名(){}就可以,不需要加function多个方法之间不需要加逗号分隔开class Star {//创建类,类名首字母注意大写 constructor(name,age) {//类的默认构造函数 即使不写,new对象的时候也会自动去调用, .原创 2020-05-28 14:44:29 · 317 阅读 · 0 评论 -
【javascript】事件委托/事件代理的理解 从0开始逐步理解
事件委托属于前端必会知识点,在实际操练中也会常用到。本小笨才以为,为了避免实操中写出bug,仅仅简单地会使用不够,还需要了解它的概念,原理,使用场景,优缺点,兼容性等等。所以今天来钻研一下。并记录下来供大家一起学习讨论。事件委托的定义:事件委托/代理的原理是DOM元素的事件冒泡。利用事件冒泡,只指定一个事件处理程序,就可以管理某一类型的所有事件。事件冒泡是什么呢?一个事件触发后,会在子元素和父元素之间传播。DOM2.0模型将事件处理流程分为三个阶段:一、事件捕获阶段,二、事件目标阶段,三、事件冒泡阶原创 2020-05-15 14:09:39 · 452 阅读 · 0 评论 -
【javascript】apply()与 call()
javascript中每个function对象都有一个apply()和一个call() 方法。/*apply()方法*/function.apply(thisObj[, argArray])/*call()方法*/function.call(thisObj[, arg1[, arg2[, [,...argN]]]]);apply()与call()的共同点:都可以用另一个对象替换当前对象。都可去调用某个对象的方法。【总结:都是使用一个对象替换另一个对象,去调用一个方法。例如:B.app原创 2020-06-23 16:11:03 · 81 阅读 · 0 评论