shanghua2020-CSDN博客

原创页面刷新后，滚动条回滚顶部

这个问题以前遇到过，直接用 $(window).scrollTop(0)可以实现。但是现在不行了，估计是跟浏览器版本有关系。百度了半天，基本上都是这个套路。但它是真的不管用。后来气的我直接爬墙去找某歌，还真找到一个解决的办法。但我也不知道它的原理是啥，反正能用，我们看下边代码。$(window).on('load', function () { setTimeout(function () { $(window).scrollTop(0); }, 0);});...

2020-12-18 18:23:09 602 2

原创 webpack获取npm命令行参数

需求：通过npm命令，添加不同的参数，来执行不同的打包内容。就这么一个小功能，我查了小半一天的资料，说的天花乱坠怎么干的都有。其实没那么复杂，我这里说两种最简单的方法，不需要引入任何的第三方模块。方法一：命令行直接输入，不需要在package.json里配置：npm run dev --aaa=/webpack/srcaaa参数名可以随便改。我们最终目的是要要拿到 /webpack/src 这个值，然后我们在webpack的打包配置文件里，直接用下边两行代码就可以了。const serve

2020-11-06 14:54:01 2919 1

原创大前端：练习题-开发脚手架及封装自动化构建工作流

一、简答题1、谈谈你对工程化的初步认识，结合你之前遇到过的问题说出三个以上工程化能够解决问题或者带来的价值。答案：工程化是根据业务特点，将前端开发流程规范化，标准化，它包括了开发流程，技术选型，代码规范，构建发布等，用于提升前端工程师的开发效率和代码质量。制定代码规范，开发流程规范代码可测试，单元测试，端到端测试等开发部署自动化文件自动编译打包，文件名随便生成解决了新版本上线缓存问题2、你认为脚手架除了为我们创建项目结构，还有什么更深的意义？减少重复性的工作，不需要复制其他项目再删除无

2020-09-07 10:31:14 294

原创大前端：练习题-ES新特性与TypeScript、JS性能优化

一、请说出下列最终得执行结果，并解释为什么。var a = [];for (var i = 0; i < 10; i++) { a[i] = function () { console.log(i); };}a[5]();答案：10。因为for循环中的 i 用var来声明会提升变量，并且循环体内的函数并不是每次循环都会执行，只有当所有循环结束时才会执行，所以无论a数组中的哪个元素，执行结果都是10。二、请说出下列最终得执行结果，并解释为什么。var tmp = 123;if

2020-08-14 15:26:09 238

原创大前端：练习题-理解JS异步编程、EventLoop、消息队列、宏任务、微任务

EventLoop事情循环，监听调用栈和消息队列。当代码从上往下依次执行时，它们会依次压入调用栈。如果中间穿插了有异步代码，比如settimeout定时器。定时器在被压入栈的同时会开启一个倒计时。当栈内存中的函数执行完并且settimeout倒计时结束，settimeout的匿名函数会被消息队列。这时事件循环开始工作，它会监听到，消息列队中有数据，将消息队列中的第一个函数压入调用栈，执行该函数。消息队列可以看做等待执行任务的列表。调用栈负责执行任务，消息列表负责管理任务，让它们排好队。事情循环负责.

2020-07-17 11:54:33 285

原创大前端：练习题-手写Promise

const { reject } = require('lodash');// 用常量定义三种状态，是因为有代码提示const PENDDING = 'pendding'; // 等待const FULFILLED = 'fulfilled'; // 成功const REJECTED = 'rejected'; // 失败class MyPromise { constructor(execute) { try { execute(this.resolve, this.reject)

2020-07-17 11:45:47 200

原创大前端：练习题-基于以下代码完成练习题

super.jsclass Container { static of(value) { return new Container(value); } constructor(value) { this._value = value; } map(fn) { return Container.of(fn(this._value)); }}class Maybe { static of(x) { return new Maybe(x); } isNothing() {

2020-07-17 11:38:59 289

原创大前端：练习题-用Promise实现下这代码

用Promise实现下这代码setTimeout(() => { let a = 'hello'; setTimeout(() => { let b = 'lagou'; setTimeout(() => { let c = 'love'; console.log(a + b + c); }, 10); }, 10);}, 10);解答：function myPromise(value) { let promise = new Promise((r

2020-07-17 11:28:59 209

原创 1-14、纯函数的副作用

我这个岁数的程序圆，学点东西不容易啊，不比你们精神小伙啊。所以。不废话了，赶紧努力吧！当数据需要依靠外部来源的时候，纯函数的结果就得不到相同输出，这就是副作用。外部数据：全局变量、接口数据、用户输入的信息。副作用让纯函数变得不纯，使方法的通用性下降，给程序带来安全隐患带来不稳定性。但是副作用不可能完全禁止，所以尽量控制它发生的范围。示例：// 不纯函数：min的发现改变时，函数的返回结果会发生变化let min = 18;function getAge(age) { return ag

2020-06-30 12:38:47 494

原创 1-13、纯函数的好处

我这个岁数的程序圆，学点东西不容易啊，不比你们精神小伙啊。所以。不废话了，赶紧努力吧！纯函数的好处：可缓存；可单元测试；并行处理，ES6以后可以通过(web worker)开启多线程。在多线程处理过程中，不需要访问共享的内存数据，可以任意运行。可缓存，示例1：// 安装loadsh库，npm i -D loadshconst _ = require('loadsh');function getArea(r) { console.log(r); return Math.

2020-06-30 11:49:33 224

原创 1-12、lodash 库

lodash.js 是一个很实用的js库，它提供了很多很实用的纯函数，对函数式编程非常的优好。在我看来，它补充了JS在处理数组及对象方面能力不足的缺陷。但是它毕竟只是一个工具而已。所以这个库我们就不多说了，自己上官网看api，这里演示几个小的例子。const _ = require('loadsh');let arr = [1,2,3,4,5]// first 查找第一个数组元素console.log(_.first(arr));// last 查找最后一个数组元素console.log

2020-06-22 18:36:46 190

原创 1-11、纯函数的概念

我这个岁数的程序圆，学点东西不容易啊，不比你们精神小伙啊。所以。一起加油吧！纯函数：相同的输入永久会得到一个相同的输出，而且没有副作用（副作用，我们后几节再说）纯函数类似数学中的函数（用来描述输入和输出之间的关系）x=sin(y)看一个图例：1 ---- sin ----> 23 ---- sin ----> 45 ---- sin ----> 6左边135是一组输入数据，右边是一组输出数据246，中间的sin就是一个纯函数用来描述输入获取输出的过程，或者说用来描

2020-06-22 18:06:02 244

原创 MongoDB-增删改查-CURD

查看库：show dbs进入库：use 库表查看表：show collections查看表数据：db.表名.find()查看表数据-格式化输出：db.表名.find().pretty()

2020-06-19 11:41:16 111

原创 1-9、闭包概念

我这个岁数的程序圆，学点东西不容易啊，不比你们精神小伙啊。所以。虽然如此，但我还是觉得闭包的概念其实不复杂，只是它的定义比较绕。官方解释：闭包是一个拥有许多变量和绑定了这些变量的环境的表达式（通常是一个函数），因而这些变量也是该表达式的一部分。官方的解释我真的是看不懂啊，还是用大白话跟大家解释一下闭包。在一个作用域，去调用一个函数内部的函数，当我们调用内部函数的时候，可以访问到外部函数的成员，这就是闭包。还是不明白也没关系，直接看代码。function makeFn() { let

2020-06-18 18:49:02 144

原创 1-8-3、模拟ES6中的some函数

我这个岁数的程序圆，学点东西不容易，不比你们小年轻啊！！！所以。回顾：some()方法，es6中的方法。是对数组中每一项运行给定函数，如果该函数对有一项返回true,则返回true。用大白话讲就是：数组中元素有一个满条件返回true。这就是some和every的区别。const some = (arr3, fn) => { let res = ''; for (let value of arr3) { res = fn(value); if (res) break;

2020-06-18 17:34:09 340

原创 1-8-2、模拟ES6中的every函数

我这个岁数的程序圆，学点东西不容易，不比你们小年轻啊！！！所以。回顾：every()方法，es6中的方法。是对数组中每一项运行给定函数，如果该函数对每一项返回true,则返回true。跟上节一样，直接上代码吧。const every = (arr, fn) => { let result = true; for (let value of arr) { result = fn(value); if (!result) { break; } } return res

2020-06-18 17:01:28 242

原创 1-8-1、模拟ES6中的map函数

说明一下，1-7内容是函数式编程中高阶函数的概念解释，我们已经把它融合到了1-6中，所以1-7就不再单独做叙述。我这个岁数的程序圆，学点东西不容易，不比你们小年轻啊！！！所以我们这次先上代码，从代码进行分析吧。const map = (arr, fn) => { let result = []; for (let value of arr) { result.push(fn(value)); } return result;};let arr = [1, 2, 3, 4];/

2020-06-18 16:50:05 133

原创 1-6、函数作为返回值

函数做为返回值，其实就是用函数生成一个函数。上代码之前，我们再来回顾一下函数式编程的核心思想。函数式编程是把运算过程抽象成函数，在任何地方都可以调用这些函数。它的意义在于函数可以灵活使用，抽象帮我们屏蔽中间的运算细节，我们只关注最终实现的目标就可以了。示例-1：function once(fn) { let done = false; return function () { if (!done) { done = true; return

2020-06-18 15:55:22 650

原创 1-5、函数作为参数

高阶函数-函数作为参数优点：更加灵活调用函数时不需要考虑它内部是如何实现的，它把内部实现的细节给我们封装好了函数名更具有实际意义示例-1： /** * 模拟forEach * 这是一个遍历函数，但是我们不确实最终的结果是直接打印，还是输出到页面上，所以我们传入一个匿名函数，去自行处理 */function forEach(arr, fn) { for (var i in arr) { fn(arr[i]); }}let aaa = [1, 2, 3, 4, 5

2020-06-17 18:50:20 124

原创 1-4、函数赋值给变量

到了我这个岁数的人，函数就不用解释了吧，它是JS中一个普通对象，可以用 new Function()来构造一个新的函数。函数是一等公民，这些事大家都知道啊！但是下边的事你知道么？高阶函数：函数存储在变量中函数作为参数函数作为返回值这节我们来看一下，把函数赋值给变量。代码如下：// 把函数赋值给变量let abc = () => { console.log('this is a function');};abc();// 示例-1const def =

2020-06-16 21:29:06 4462 1

原创 1-3、什么是函数式编程

“函数式编程”首先要说一点，它是一种很古老的概念，它的历史可以追溯到第一台计算机的诞生。这么老，为什么还要学？因为它随着React的流行受到了越来越多的关注，React的生态组件里运用了大量的高阶函数，高阶函数就是函数式编程的一个特性。包括Vue3也开始运用函数式编程。所以你学不学？网上有太多的帖子来解释这个概念，但大多数帖子的解释都不太好理解。尤其像我这种上岁数的人，完全理解不了。现在我用最直白的大白话来解释一下它的概念，这要是再看不懂的话。我只能说：永别！！！！！函数式编程（Funct

2020-06-16 20:11:16 173

原创 js判断APP和浏览器

废话不多说，直接上代码，该代码通过匹配 navigator.userAgent在不改变url地址的情况下，直接区分是app还是浏览器function isapp() {if (/^.+(Mobile\/\w+)\s?$/.test(navigator.userAgent)){// IOS端APPreturn true;} else

2017-12-26 16:31:26 4386 1

qq_41543217的博客