JS
文章平均质量分 85
秃如其来的秃头
种一棵树最佳时间是十年前,其次是现在!
如果一直躲在舒适区,最终一定会进入恐慌区。
展开
-
JavaScript深入之继承的多种方式和优缺点
JavaScript深入之继承的多种方式和优缺点对象得原型JS当中每个对象都有一个特殊的内置属性[[prototype]],这个特殊的对象可以指向另外一个对象当我们通过引用对象的属性 key 来获取一个 value 时,它会触发 [[Get]]的操作这个操作会首先检查该属性是否有对应的属性,如果有的话就使用它如果对象中没有改属性,那么会访问对象的 [[prototype]] 内置属性指向的对象上的属性那么如果通过字面量直接创建一个对象,这个对象也会有这样的属性吗?如果有,应该如何获取原创 2022-01-13 10:36:52 · 405 阅读 · 0 评论 -
JS函数式编程
JS函数式编程实现 call第一版Function.prototype.mycall = function(){ // 1. 获取需要被执行的函数 foo.mycall 这里的 this 就是 foo 该函数 let fn = this console.log('Function=>',this) fn()}// 测试用例function foo(){ console.log('foo=>',this)}foo.mycall()原创 2021-10-28 17:21:49 · 653 阅读 · 0 评论 -
JS执行过程、词法作用域、执行上下文、深入变量对象、作用域链
JS执行过程、词法作用域、执行上下文、深入变量对象、作用域链JavaScript深入系列作用域作用域是指程序源代码中定义变量的区域作用域规定了如何查找变量,也就是确定当前执行代码对变量的访问权限JS采用词法作用域(lexical scoping),也就是静态作用域静态作用域与动态作用域JS采用的是词法作用域,函数的作用域在定义函数定义的时候就决定了 --重点而与词法作用域相对的是动态作用域,函数的作用域是在函数调用的时候才决定的。var scope = "global scope";f原创 2021-10-23 17:26:23 · 216 阅读 · 0 评论 -
前端代码规范插件 vscode eslint stylelint
前端代码规范编辑器格式统一然后项目根目录添加文件 .editorconfig,编写以下配置:# http://editorconfig.orgroot = true[*]charset = utf-8indent_style = spaceindent_size = 2end_of_line = lfinsert_final_newline = truetrim_trailing_whitespace = true[*.md]insert_final_newline = f原创 2021-02-25 14:13:27 · 927 阅读 · 0 评论 -
JavaScript版数据结构与算法-链表
JavaScript版数据结构与算法-链表链表多个元素组成的列表元素存储不连续,用next指针连在一起链表 VS 数组**数组:**增删非首尾元素时往往需要移动元素**链表:**增删非首尾元素,不需要移动元素,只需要更改next的指向即可js的链表js中是没有链表可以用Object模拟链表const a = { val : 'a'}const b = { val : 'b'}const c = { val : 'c'}const d = { val : 'd'}a.原创 2021-01-09 15:25:17 · 356 阅读 · 0 评论 -
数据结构与算法之美-数组 vs 链表
数据结构与算法之美-数组 vs 链表数组(Array)是一种线性表数据结构。它用一组连续的内存空间,来存储一组具有相同类型的数据。线性表线性表就是数据排成像一条线一样的结构。每个线性表上的数据最多只有前和后俩个方向,其实除了数组、链表、队列、栈等也是线性表结构非线性表比如二叉树、堆、图等。之所以叫非线性,是因为,在非线性表中,数据之间并不是简单的前后关系。连续的内存控件和相同类型的数据随机访问数组和链表区别链表适合插入、删除,时间复杂度O(1);数组适合查找,查原创 2021-01-08 17:09:57 · 154 阅读 · 0 评论 -
复杂度分析
复杂度分析复杂度分析:分析、统计算法得执行效率和资源消耗【注】:大 O 这种复杂度表示方法只是表示一种变化趋势时间复杂度分析【注】:它表示的是一个算法执行效率与数据规模增长的变化趋势,所以不管常量的执行时间多大,我们都可以忽略掉。因为它本身对增长趋势并没有影响。时间复杂度的全称是渐进时间复杂度,表示算法的执行时间与数据规模之间的增长关系。只关注循环执行次数最多的一段代码加法法则:总复杂度等于量级最大的那段代码的复杂度乘法法则:嵌套代码的复杂度等于嵌套内外代码复杂度的乘积几种常见时原创 2021-01-07 17:27:53 · 117 阅读 · 0 评论 -
Clean Code JavaScript 代码规范以及建议
Clean Code JavaScript 代码规范以及建议Clean Code JavaScript 英文原版代码整洁之道中文版代码整洁之道中文版默认实参通常比短路更简洁。请注意,如果您使用它们,您的函数将只为未定义的参数提供默认值。其他“假”值,如''、""、false、null、0和NaN,将不会被默认值替换。Bad:function createMicrobrewery(name) { const breweryName = name || "Hipster Brew Co.";原创 2020-12-16 13:58:22 · 440 阅读 · 0 评论 -
对象 字符串 实用30-seconds-of-code
对象 字符串 实用30-seconds-of-code原文:https://github.com/Chalarangelo/30-seconds-of-code作者:Chalarangelo翻译:http://caibaojian.com/30-seconds-of-code.html译者:蔡宝坚收集有用的 Javascript 片段, 你可以在30秒或更少的时间里理解。clea...原创 2020-04-28 23:27:33 · 246 阅读 · 0 评论 -
函数 功能 30-seconds-of-code
函数 功能原文:https://github.com/Chalarangelo/30-seconds-of-code作者:Chalarangelo翻译:http://caibaojian.com/30-seconds-of-code.html译者:蔡宝坚收集有用的 Javascript 片段, 你可以在30秒或更少的时间里理解。chainAsync:链异步函数循环遍历包含异步事件...原创 2020-04-27 23:24:29 · 1334 阅读 · 0 评论 -
浏览器 日期 30-seconds-of-code
浏览器 日期 30-seconds-of-code原文:https://github.com/Chalarangelo/30-seconds-of-code作者:Chalarangelo翻译:http://caibaojian.com/30-seconds-of-code.html译者:蔡宝坚收集有用的 Javascript 片段, 你可以在30秒或更少的时间里理解。bottomV...原创 2020-04-26 23:37:35 · 162 阅读 · 0 评论 -
30-seconds-of-code JavaScript 数组篇 持续更新
30-seconds-of-codearrMax:返回数组中得最大值将Math.max()与扩展运算符 (...) 结合使用以获取数组中的最大值。const arrMax = (arr)=>Math.max(...arr)arrMin:返回数组中的最小值将Math.min()与扩展运算符 (...) 结合使用以获取数组中的最小值。const arrMin = arr =>...原创 2020-04-22 23:49:38 · 236 阅读 · 0 评论 -
iView Table自定义过滤规则动态更改表格中得数据,比如时间、数量
iView Table自定义过滤 表格中得数据,比如时间、数量有个数据展示页面,后端只返回最原始数据,其余的都是我个前端仔进行换算,比如利润、利润率、占比啥的,但这不算什么,连时间、数量、等过滤条件都是前端来处理,刚接到这个需求,心里就在想,这些过滤不都是前端带参数去后端查询么,然后就去问后端,后端说就你前端处理把,因为你处理和我后端处理是一样得,我当时就纳闷了,(我脑海中马上闪现我那快忘光得 ...原创 2020-03-30 10:31:38 · 1131 阅读 · 0 评论 -
12种不宜使用的Javascript语法(Javascript语言精粹)
1. ==Javascript有两组相等运算符,一组是==和!=,另一组是===和!==。前者只比较值的相等,后者除了值以外,还比较类型是否相同。请尽量不要使用前一组,永远只使用===和!==。因为==默认会进行类型转换,规则十分难记。如果你不相信的话,请回答下面五个判断式的值是true还是false: false == 'false' false == undefined...原创 2020-03-21 19:04:14 · 120 阅读 · 0 评论 -
JavaScript对象API解密
JavaScript对象API解密创建对象得俩种方式var o = new Object()var o = {} // 推荐使用该构造器可以接受任何类型得参数,并且会自动识别参数得类型,并选择更合适得构造器来完成相关得操作var o = new Object('something');o.constructor; // ƒ String() { [native code] }var...原创 2020-02-05 00:53:18 · 150 阅读 · 0 评论 -
JavaScript数组API全解密(二)
JavaScript数组API全解密(二)不会改变自身的方法(9个)基于ES7,不会改变自身的方法一共又9个,分别是concat、join、slice、toString、toLocateString、indexOf、lasteIndexOf、未标准的toSource以及ES7新增的方法includes.concatconcat()方法将传入的数组或者元素与原数组合并,组成一个新的数组并返回...原创 2020-02-04 18:53:53 · 183 阅读 · 0 评论 -
JavaScript数组API全解密(一)
JavaScript数组API全解密(一)Array构造器语法及介绍: Array构造器根据参数长度的不同,有如下两种不同的处理:new Array(arg1, arg2,…),参数长度为0或长度大于等于2时,传入的参数将按照顺序依次成为新数组的第0至N项(参数长度为0时,返回空数组)。new Array(len),当len不是数值时,处理同上,返回一个只包含len元素一项的数组;...原创 2020-02-03 18:35:13 · 137 阅读 · 0 评论 -
JavaScript字符串API全解密
JavaScript字符串API全解密charAtcharAt()方法返回字符串中指定位置的字符语法:str.chartAt(index)index为字符串索引(取值从 0 至 length - 1),如果超出范围,则返回空串'123456'.charAt(3) // 输出4charCodeAtcharCodeAt()返回指定索引处字符的Unicode数值语法:str.charC...原创 2020-02-01 00:52:19 · 238 阅读 · 0 评论 -
JS中金额转换以及格式化Vue过滤器
JS中金额转换以及格式化- 为数字加上单位:万或亿import Vue from 'vue'/** * 为数字加上单位:万或亿 * * 例如: * 1000.01 => 1000.01 * 10000 => 1万 * 99000 => 9.9万 * 566000 => 56.6万 ...原创 2020-01-13 09:18:17 · 1326 阅读 · 0 评论 -
js 逻辑运算符
js 逻辑运算符逻辑运算符通常用于布尔型(逻辑)值。这种情况下,它们返回一个布尔值。然而,&& 和 || 运算符会返回一个指定操作数的值,因此,这些运算符也用于非布尔值。这时,它们也就会返回一个非布尔型值。描述逻辑运算符如下表所示 (其中expr可能是任何一种类型, 不一定是布尔值):运算符 语法 说明逻辑与,AND(&&) expr1 &&a...原创 2020-01-02 21:21:40 · 218 阅读 · 0 评论 -
js的静态方法和静态属性
js的静态方法和静态属性在有些面向对象的编程语言中,我们可以通过static关键词来声明静态属性,这一点,在Javascript中可以通过**“模拟”**的方式实现。1、定义静态属性基本语法:类名.属性(静态属性)其访问时也是通过类名.属性进行访问的。特别注意:在Javascript中,Math数学类下的所有属性和方法都是静态的。在Javascript中,有两种属性:对象.属性(实...原创 2019-12-03 20:43:43 · 1285 阅读 · 0 评论 -
input格式化输入框内容后光标位置错位问题及其解决办法
input格式化输入框内容后定位错位问题最近公司有一个 汇率换算的小项目 用的 nuxt 服务端渲染,UI用的是饿了么的UI框架,总共 7 个输入框,数据是根据一个输入框中的值进行双向绑定换算的,这些都不是重点。需求是用户实时输入的时候 input输入框中的值是实时改变的,但是在实时改变的时候,由于数据是千分位格式化了的,当输入的时候,数据就会格式,导致光标会错位,从而导致输入错误出现这个...原创 2019-11-24 00:48:19 · 7040 阅读 · 0 评论 -
nuxt 利用Vuex控制状态 切换城市以及切换城市之后跳转首页遇到的坑
nuxt 利用Vuex控制状态 切换城市以及切换城市之后跳转首页遇到的坑在 切换城市的VUE 组件中 handleSelect: function(item) { const xzdCity = item.value this.$store.commit('xzCity/changeCity',xzdCity) this.$router.pu...原创 2019-11-23 20:41:13 · 545 阅读 · 8 评论 -
Js千分位格式化金额数字的方法
Js千分位格式化金额数字的方法应用场景:在比较大小的时候,金额的千分位格式需要去掉,才能比较大小!1.添加千分位function fmoney(s, n) { n = n > 0 && n < = 20 ? n : 2; s = parseFloat((s + "").replace(/[^\d\.-]/g, "")).toFixed...原创 2019-11-21 17:35:36 · 391 阅读 · 0 评论 -
使用Nuxt.js和Vue-i18n重定向到同一页面但切换语言URL
使用Nuxt.js和Vue-i18n重定向到同一页面但切换语言URL公司最近提出一个需求,就是当用户切换语言的时候,在路由中需要将其选中的语言加入到路由中例如网址:localhost/about应该通过该方法(通过按特定按钮)重定向到:localhost/bg/aboutNuxt文档中所建议的,用于使用Vue-i18n进行本地化https://nuxtjs.org/examples/i...原创 2019-11-18 15:02:20 · 1727 阅读 · 0 评论 -
JS 基础小题
JS 基础小题const shape = { radius: 10, diameter() { return this.radius * 2 }, perimeter: () => 2 * Math.PI * this.radius}shape.diameter()shape.perimeter()// B: 20 and NaN注:对于箭头函数...原创 2019-11-05 20:43:50 · 218 阅读 · 0 评论 -
前端JS面试题
前端JS面试题call 和 apply 的区别 是什么,哪一个性能更好一些?传参的区别call 是一个个传递apply是传递一个数组bind 是预先处理,但是不会立即执行但是 call 在基于ES6的展开运算符也可以将数组中的每一项传递给函数call apply 都是 Function 原型上面的方法,而每个函数作为 Function 的实例,可以调取其方法在...原创 2019-10-31 14:26:46 · 305 阅读 · 0 评论 -
数组扁平化
数组扁平化// 编写一个程序,将数组扁平化,并去除其中重复部分数据,// 最终得到一个升序而且不重复的数组let arr = [1,2,3,[4,5,6,7],[1,23,5,[1,2,3,45,5]],10]//方法一://使用 ES6 中提供的 Array.prototype.flat 处理//然后在使用 set 方法去除重复项arr = arr.flat(Infinity)...原创 2019-10-29 14:57:31 · 145 阅读 · 0 评论 -
深入javascript之原型和原型链
JS原型链你是如何理解原型 和原型链得?把所有对象共用得属性放在一个堆内存对象上(共用属性组成得对象),然后让每一个对象得_propto_ 存储这个【共用属性组成得对象】得地址,而这个公用属性就是原型原型得出现就是为了减少不必要得内存消耗,而原型链就是对象通过__proto__向当前实例所属类得原型上查找属性或方法得hi之,如果找到 Object 得原型上还是没有找到想要得属性或者方...原创 2019-10-28 21:09:14 · 276 阅读 · 0 评论 -
前端JS面试题总结
前端JS面试题总结你是如何理解原型 和原型链得?把所有对象共用得属性放在一个堆内存对象上(共用属性组成得对象),然后让每一个对象得_propto_ 存储这个【共用属性组成得对象】得地址,而这个公用属性就是原型原型得出现就是为了减少不必要得内存消耗,而原型链就是对象通过__proto__向当前实例所属类得原型上查找属性或方法得hi之,如果找到 Object 得原型上还是没有找到想要得属性或者...原创 2019-10-28 13:29:43 · 564 阅读 · 0 评论 -
call、apply、bind作用、实现及详解
call、apply、bind作用、实现及详解它们有什么不同?怎么用?call 接收多个参数,第一个为函数上下文也就是this.后边参数为函数本身的参数let obj ={ name:'小猪头'}function printName(firstName, lastName,flag){ console.log(this) console.log(`第一个名字${firstNa...原创 2019-10-16 16:56:59 · 210 阅读 · 0 评论 -
前端 ES6知识点总结
前端 ES6知识点总结ES6变量的解构赋值数组的解构赋值:简单的数组解构:let [a,b,c] = [1,2,3] //从数组中提取值,按照位置的对象关系对变量赋值。数组模式和赋值模式统一:let [a,[b,c],d]=[1,[2,3],4];//简单的理解为等号左边和等号右边的形式要统一,如果等号两边形式不一样,很可能获得undefined或者直接报错...原创 2019-10-15 14:40:20 · 256 阅读 · 0 评论 -
antd中Form及其getFieldDecorator的应用
antd中Form及其getFieldDecorator的应用import React from 'react'import {Card,Form,Input,Button,message} from 'antd' const FormItem= Form.Item;class FormLogin extends React.Component{ handleSubmit=(...原创 2019-10-11 21:05:37 · 5697 阅读 · 1 评论 -
JS数组去重的多种方法
JS数组去重的多种方法解决方案:1、依次拿出数组中的每一项(排除最后一项,最后一项后面没有需要比较的内容)2、和当前拿出项后面的每一项依次比较3、如果发现有重复的,我们把找到的这个重复向在原有数组中删除掉方案一:双重for 循环var ary = [1,2,3,2,2,7,9,2,3,5,2,8]for(var i =0; i<ary.length-1;i++){ for(...原创 2019-08-20 16:03:22 · 119 阅读 · 0 评论 -
JS多种方法实现动态选择选项卡
JS多种方法实现动态选择选项卡首先贴出HTML 和 CSS 这个不是重点<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale...原创 2019-08-20 22:27:08 · 1353 阅读 · 0 评论 -
JS变量类型和计算(前端面试题)
JS变量类型和计算(前端面试题)**问题一:**JS中使用typeof能得到的类型typeof undefined // undefinedtypeof 'abc' // stringtypeof 123 //numbertypeof true // booleantypeof {} // objecttypeof [] // objecttypeof null //...原创 2019-08-27 22:07:56 · 111 阅读 · 0 评论 -
JS原型及其原型链(知识点及其面试题)
JS原型及其原型链(知识点及其面试题)构造函数//构造函数名 首位大写function Foo(name,age){ this.name = name this.age = age this.class = 'class01' //return this //默认执行这一行}//当new 这个函数执行的时候 this 变成空对象var f = new Foo('小明',25...原创 2019-08-27 23:55:24 · 2275 阅读 · 0 评论 -
JS变量提升及作用域(面试题)
JS变量提升作用域(面试题)变量提升- 当栈内存(作用域)形成,JS代码自上而下执行之前,浏览器首先会把所有带 “VAR”/“FUNCTION” 关键词的进行提前 “声明” 或者 “定义” ,这种预先处理机制称之为 “变量提升”声明(declare):var a (默认值undefined)定义(defined):a=12 (定义其实就是赋值操作)【变量提升阶段】带“VAR”的只声...原创 2019-08-28 11:36:50 · 877 阅读 · 0 评论 -
模仿jQuery css及each实现基本功能
模仿jQuery css及each实现基本功能jQuery - css() 方法css() 方法设置或返回被选元素的一个或多个样式属性。返回 CSS 属性$("p").css("background-color");设置 CSS 属性$("p").css("background-color","yellow");设置多个 CSS 属性$("p").css({...原创 2019-09-03 16:41:50 · 290 阅读 · 0 评论 -
JS事件传播机制
事件的传播机制什么是事件?【DOM事件】事件就是一件事情或者一个行为(对于元素来说,他的很多事件都是天生自带的),只要我们去操作这个元素,就会触发这些行为事件绑定:给元素天生自带的事件行为绑定方法,当事件触发,会把对应的方法执行 oBox.onclick = function(){}冒泡传播:触发当前元素的某一个事件行为,不仅当前元素事件行为触发,而且其祖先元素的相关事件行...原创 2019-09-04 15:13:09 · 179 阅读 · 0 评论