程序员既明-优快云博客

原创前端面试题JavaScript篇——2022-09-23

公粽号【今天也要写bug】每日推送，欢迎关注每日3题1 以下代码执行后，控制台中的输出内容为？const user = { name: "JM", age: 18,};const data = JSON.stringify(user, ["age"]);console.log(data);2 点击p标签时，会输出什么function Car() { this.make = "兰博基尼"; return { mak

2022-09-23 14:41:58 335

原创前端面试题JavaScript篇——2022-09-22

每日3题1 以下代码执行后，控制台中的输出内容为？console.log(+true, !'hello')2 点击p标签时，会输出什么const numbers=[1,2,3,4,5]const [y] = numbersconsole.log(y)3 以下代码执行后，控制台中的输出内容为？const fn = (x) => (y) => (z) => { console.log(x, y, z);};fn(1)(2)(3);公众号【今天也要写

2022-09-22 15:01:18 416

原创前端面试题JavaScript篇——2022-09-21

每日3题1 以下代码执行后，控制台中的输出内容为？class A { static a = "123";}class B extends A {}console.log(B.a);2 以下3句语句，哪句是合法的1.toString();1..toString();1...toString();3 以下代码执行后，控制台中的输出内容为？const a = [ [0, 1], [2, 3],].reduce( (pre, cur) => {

2022-09-21 16:21:19 407

原创前端面试题JavaScript篇——2022-09-20

每日3题1 以下代码执行后，控制台中的输出内容为？// index.jsconsole.log(1);import { sum } from "./sum.js";console.log(sum(1, 2));//sum.jsconsole.log(2);export const sum = (a, b) => a + b;2 以下代码执行后，控制台中的输出内容为？const value = { number: 10 };const multiply = (

2022-09-20 17:08:51 287

原创从零打造“乞丐版” React（一）——从命令式编程到声明式编程

这个系列的目的是通过使用 JS 实现“乞丐版”的 React，让读者了解 React 的基本工作原理，体会 React 带来的构建应用的优势1 HTML 构建静态页面使用 HTML 和 CSS，我们很容易可以构建出上图中的页面<!DOCTYPE html><html lang="en"> <head> <title>Build my react</title> <style>

2022-09-18 14:23:41 315

原创前端面试题JavaScript篇——2022-09-16

每日3题1 以下代码执行后，控制台中的输出内容为？// 以下代码执行后，浏览器的控制台中输出的内容是什么var arr = [0, 1, 2];arr[10] = 10;var newArr = arr.filter((x) => x === undefined);console.log(newArr);2 以下代码执行后，控制台中的输出内容为？// 以下代码执行后，控制台中输出的内容是什么const obj = { 2: 3, 3: 4, length: 2, p

2022-09-16 15:54:55 284

原创前端面试题JavaScript篇——2022-09-15

每日3题1 以下代码执行后，控制台中的输出内容为？// 以下代码执行后，控制台中输出的内容是什么var fullname = "a";var obj = { fullname: "b", prop: { fullname: "c", getFullname: function () { return this.fullname; }, },};console.log(obj.prop.ge

2022-09-15 10:08:47 269

原创前端面试题JavaScript篇——2022-09-14

每日3题1 以下代码执行后，控制台中的输出内容为？var company = { address: "chengdu",};var obj = Object.create(company);delete obj.address;console.log(obj.address);2 以下代码执行后，控制台中的输出内容为？var a = [0];if (a) { console.log(a == true);} else { console.log(a);}

2022-09-14 13:43:43 172

原创前端面试题JavaScript篇——2022-09-13

每日3题34 以下代码执行后，控制台中的输出内容为？const num = { a: 10, add() { return this.a + 2; }, reduce: () => this.a - 2,};console.log(num.add());console.log(num.reduce());35 以下代码执行后，控制台中的输出内容为？var x = 1;if (function f() {}) { x += typeof f;}cons

2022-09-13 14:49:39 226

原创前端面试题JavaScript篇——2022-09-09

每日3题31 关于AMD、CMD规范区别说法正确的是？（多选）A.AMD规范：是 RequireJS在推广过程中对模块定义的规范化产出的B.CMD规范：是SeaJS 在推广过程中对模块定义的规范化产出的C.CMD 推崇依赖前置;AMD 推崇依赖就近D.CMD 是提前执行;AMD 是延迟执行E.AMD性能好,因为只有用户需要的时候才执行;CMD用户体验好,因为没有延迟,依赖模块提前执行了32 以下代码执行后，控制台中的输出内容为？console.log(['1','2&

2022-09-09 21:06:56 303

原创前端面试题JavaScript篇——2022-09-08

每日3题28 以下代码执行后，控制台中的输出内容为？function showCase(value){ switch(value){ case 'A': console.log('case A'); break; case 'B': console.log('case B'); break;

2022-09-08 16:29:23 206

原创前端面试题JavaScript篇——2022-09-07

每日3题25 以下代码执行后，控制台中的输出内容为？let a = { i: 0, [Symbol.toPrimitive]: () => ++a.i,};console.log(a == 1 && a == 2 && a == 3);26 变量 a 会被 GC 吗，为什么？function test(){ var a = 1; return function(){ eval("") }}

2022-09-07 18:33:36 222

原创前端面试题每日3题——2022-09-06

每日3题22 以下代码执行后，控制台中的输出内容为？var a = [1, 2, 3];a.join = a.shift;console.log(a == 1 && a == 2 && a == 3);23 以下代码执行后，控制台中的输出内容为？var arr = [0, 1];arr[5] = 5;var newArr = arr.filter((x) => { return x === undefined;});console.log(ne

2022-09-06 21:48:14 191

原创前端面试题每日3题——2022-09-05

19 以下代码执行后，控制台中的输出内容为？var a2 = {}, b2 = Symbol('123'), c2 = Symbol('123');a2[b2] = 'b';a2[c2] = 'c';console.log(a2[b2]);20 以下代码执行后，控制台中的输出内容为？var a3 = {}, b3 = { key: "123" }, c3 = { key: "456"

2022-09-05 14:06:07 247

原创前端面试题每日3题——2022-09-04

每日 3 题16 以下代码执行后，控制台中的输出内容为？let a = { n: 1 };let b = a;a.x = a = { n: 2 };console.log(a.x);console.log(b.x);17 以下代码执行后，控制台中的输出内容为？let a = {};let b = "123";let c = 123;a[b] = "b";a[c] = "c";console.log(a[b]);18 以下

2022-09-04 15:13:16 251

原创前端面试题 JavaScript 基础 —— 2022-09-03

每日 3 题13 以下代码执行后，控制台中的输出内容为？Object.prototype.a = 1;Function.prototype.b = 2;function F() {}var f = new F();console.log(F.a);console.log(F.b);console.log(f.a);console.log(f.b);14 以下代码执行后，控制台中的输出内容为？var a = 2 >= 3 || true && 1 || false;

2022-09-03 11:20:13 220

原创前端面试题每日3题——2022-09-02

每日 3 题10 以下代码执行后，控制台中的输出内容为？var obj = { a: 1,};((obj) => { console.log(obj.a); obj.a = 3; var obj = { a: 2, }; console.log(obj.a);})(obj);console.log(obj.a);11 以下代码执行后，控制台中的输出内容为？function Fun() {}Fun.prototype.a = 1;let f1

2022-09-02 11:59:34 248

原创 JavaScript 设计模式及代码实现——代理模式

代理模式1 定义为其他对象提供一种代理以控制对这个对象的访问在某些情况下，一个对象不适合或者不能直接引用另一个对象，而代理对象可以在客户端和目标对象之间起到中介的作用。2 应用举例2.1 缓存代理现在我们有一个可以查询城市经纬度的函数：const getLatLng = (address) => { if (address === "Beijing") { return "北京经纬度"; } else if (address

2022-09-01 19:06:32 259

原创前端面试题每日3题——2022-09-01

每日 3 题7 以下代码执行后，控制台中的输出内容为？const obj = { flag: false,};function A() { this.flag = true; return obj;}const a = new A();console.log(a.flag);8 以下代码执行后，控制台中的输出内容为？console.log(1);setTimeout(() => { console.log(2);}, 0);console.log(3);

2022-09-01 11:17:04 146

原创前端面试题每日3题——2022-09-01

每日 3 题7 以下代码执行后，控制台中的输出内容为？const obj = { flag: false,};function A() { this.flag = true; return obj;}const a = new A();console.log(a.flag);8 以下代码执行后，控制台中的输出内容为？console.log(1);setTimeout(() => { console.log(2);}, 0);console.log(3);

2022-09-01 11:15:05 588

原创前端也该刷点算法题——双指针解“链表”题也太香了叭！

双指针解“链表”题也太香了叭！同步双指针1 查找链表中倒数第 k 个节点剑指Offer22.链表中倒数第k个节点思路：假设链表的长度为n，不难得出倒数第k个节点即为整数第n + 1 - k。如果一个指针从头节点开始走k步（头节点算作第1步），则还需n + 1 - k步才能走完链表（到达尾节点的next，即 null）。我们用双指针，一个指针先走k步，然后两个指针同时走n + 1 - k步，其中一个指针走完链表，另一个指针走到第n + 1 - k个节点处，即倒数第k个节点代码JS

2022-08-31 20:13:59 153

原创前端面试题每日3题——2022-08-31

每日 3 题1 以下代码执行后，控制台中的输出内容为？var foo = function bar() { return 123;};console.log(typeof foo);console.log(typeof foo());console.log(typeof bar());2 以下代码执行后，控制台中的输出内容为？var obj = { a: 1, foo: function () { return this.a; },};var fun = obj

2022-08-31 14:34:47 703

原创前端面试题每日3题——2022/08/30

1 以下代码执行后，控制台中的输出内容为？for (let i = 0; i < 3; i++) { setTimeout(() => { console.log(i); });}for (var j = 0; j < 3; j++) { setTimeout(() => { console.log(j); });}2 以下代码执行后，控制台中的输出内容为？if (!("a" in window)) { var a

2022-08-30 18:45:32 447

翻译 7个技巧让你写出干净的 TSX 代码

原文链接：https://dev.to/ruppysuppy/7-tips-for-clean-react-typescript-code-you-must-know-2da2“干净的代码”不仅是可以正常运行的代码。它指的是组织整齐、易于阅读、易于理解且易于维护的代码。让我们来看看 React 中“干净代码”的一些最佳实践，它们可以让你更加轻松地维护代码！🚀🌕1. 为所有值提供显式类型使用 TypeScript 时，很多人经常不为值提供显式类型，从而错失 TS 在开发中的真正用处坏栗子 01:.

2022-08-30 14:02:39 1277

原创 JavaScript设计模式及代码实现——单例模式

单例模式1 定义保证一个类仅有一个实例，并提供一个访问它的全局访问点。2 应用时机当一个类的实例被频繁使用，如果重复创建这个实例，会无端消耗资源。比如 dialog 弹窗会被全局重复使用业务功能本身决定了全局只能有唯一的实例。比如 redux 管理的数据，只能有唯一的一份3 应用场景对于前端应用的许多基本组件：比如 dialog、message等等，会被全局频繁使用，就应该维护一个全局唯一的实例，避免重复创建带来不必要的资源消耗。业务组件也同理：比如购物车组件、登录弹窗组件等对于

2022-08-29 13:44:41 172

原创 react 也就这么回事 05 —— 组件 & Props

什么是组件：用来实现局部功能的可复用代码片段比如很多界面会用到“分页”功能，因此可以将它封装成独立的组件这样用到分页的界面只需引入该组件而不必重新写代码1 定义组件在 React 中有两种组件，一种是函数组件，一种是类组件1.1 函数组件定义组件最简单的方式就是编写 JavaScript 函数对 React 来说，能够返回一个 React 元素的函数就叫组件function MyComponent() { return <h2>我是一个函数组件</h2>

2022-03-14 13:26:46 354

原创 react 也就这么回事 04 —— 元素渲染

为了便于后续理解，我们再来回顾和总结前面几个章节的内容1 元素及其创建元素是构成 React 应用的最小砖块。元素描述了你在屏幕上想看到的内容。const element = <h1>Hello, world</h1>;与浏览器的 DOM 元素不同，React 元素是创建开销极小的普通对象。React DOM 会负责更新 DOM 来与 React 元素保持一致。我们用 React.createElement来创建 React 元素（语法上还可以使用其语法糖 JSX）2

2022-03-01 16:11:08 395

原创 react 也就这么回事 03 —— JSX 的注意点

1 JSX 是一个表达式JSX 是 JavaScript 的语法扩展，本质上是 React.createElement()方法的语法糖。Babel 会把 JSX 转译成一个名为 React.createElement() 函数调用，所以它被看作一个表达式。这意味着你可以在 if 语句和 for 循环的代码块中使用 JSX，将 JSX 赋值给变量，把 JSX 当作参数传入，以及从函数中返回 JSX：function getGreeting(user) { if (user) { retur

2022-02-24 15:40:14 1901

原创 react 也就这么回事 02 —— JSX 插值表达式、条件渲染以及列表渲染

我们已经学会了 React 创建元素和渲染元素ReactDOM.render(<div>Hello React!</div>, document.getElementById("root"));Hello React会被嵌入到<div>标签中，并且显示在页面上。那么 React 如何将变量、算术运算、函数调用等表达式的结果显示在页面上呢？插值表达式React 提供了在 JSX 中嵌入表达式的方式，我们可以将表达式包裹在大括号中，并将它嵌入 J

2022-02-23 23:27:53 781

原创 react 也就这么回事 01 —— React 元素的创建和渲染

React 是一个用于构建用户界面的 JavaScript 库它包括两个库：react.js 和 react-dom.jsreact.js：React 的核心库，提供了 React.js 的核心功能，比如创建 React 组件、组件的生命周期等react-dom.js：提供了和浏览器交互的 DOM 功能，比如：将组件渲染到页面上React 和 ReactDOM我们可以通过官方提供的 CDN 链接引入 react.js 和 react-dom.js 这两个库，从而在 HTML 中使用<s

2022-02-22 13:52:59 757

原创 Vue 基础自查——条件渲染和列表渲染

v-if和v-show的区别是什么？v-if和v-for为什么不能一起用？v-for中的key有什么作用？1 v-if 和 v-show1.1 作用都用来控制元素的显示和隐藏1.2 控制元素显隐的方式v-if控制虚拟DOM树上元素的创建和销毁，Vue的响应系统会根据虚拟DOM树对实际DOM进行更新，从而间接控制实际DOM上元素的显隐v-show通过给元素添加样式display:none来让元素隐藏1.3 初始渲染对比v-if是惰性的，如果初始渲染条件为false，什么都不做；只有..

2021-11-06 11:16:40 124

原创 Vue 基础自查——watch、computed和methods的区别

Vue 基础自查——watch、computed和methods的区别1 前言创建一个Vue实例时，可以传入一个选项对象const vm = new Vue({ data: { msg: 'hello' }， computed: {}, methods: {}, watch: {}})这个选项对象可以指定非常多的选项（或者说属性），和数据相关的选项有：包括但不限于data、methods、computed、watch等等其中methods、computed、watc

2021-11-04 22:38:46 116

原创面试官：用“尾递归”优化斐波那契函数

1 前言编程题：输入一个整数n，输出斐波那契数列的第n项有些面试官喜欢问这道题。可能你觉得这太简单了，用递归或递推一下子就实现了。正当你信心满满用了两种方式实现的时候…面试官：现在请用“尾递归”优化你的递归实现，用“ES6解构赋值”优化你的递推实现…这时候如果你的基本功不扎实，可能你就懵了。就是这么简单的一道题，包含着相当多的JS知识点，尤其是它的优化过程可以看出你的基本功扎不扎实，所以有些面试官喜欢问这道题。下面我们来看递归和递推这两种实现以及它们各自的优化过程2 递归和尾递归2.

2021-11-04 10:41:22 577

原创面试官：能用JS写一个发布订阅模式吗？

什么是发布订阅模式？能手写实现一下吗？它和观察者模式有区别吗？…1 场景引入我们先来看这么一个场景：假设现在有一个社交平台，平台上有一个大V叫NamiNami很牛，多才多艺，目前她有2个技能：会写歌、会拍视频她会把这些作品发布到平台上。关注她的粉丝就会接收到这些内容现在他已经有3个粉丝了，分别是：Luffy、Zoro、Sanji每次只要Nami一发布作品，3个粉丝的账号上收到的消息就会更新现在用代码来表示：const luffy = { update: function (songs,

2021-11-03 00:06:25 253

原创面试官：JavaScript如何实现数组拍平（扁平化）方法?

1 什么叫数组拍平？概念很简单，意思是将一个“多维”数组降维，比如：// 原数组是一个“三维”数组const array = [1, 2, [3, 4, [5, 6], 7], 8, 9]// 可以降成二维newArray1 = [1, 2, 3, 4, [5, 6], 7, 8, 9]// 也可以降成一维newArray2 = [1, 2, 3, 4, 5, 6, 7, 8, 9]数组拍平也称数组扁平化、数组降维。2 JS标准库中的数组拍平方法JavaScript标准库中已经实现

2021-11-01 21:05:48 2179

原创前端面试手写代码——call、apply、bind

1 call、apply、bind 用法及对比1.1 Function.prototype三者都是Function原型上的方法，所有函数都能调用它们Function.prototype.callFunction.prototype.applyFunction.prototype.bind1.2 语法fn代表一个函数fn.call(thisArg, arg1, arg2, ...) // 接收参数列表fn.apply(thisArg, argsArray) // apply 接收数组参数

2021-10-27 11:44:53 228

原创前端面试手写代码——模拟实现new运算符

⚠ 预备知识：了解原型和原型链了解this绑定1 new 运算符简介MDN文档：new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。class Person { constructor(name) { this.name = name; }}// 创建自定义对象类型的实例const person = new Person('小明')// 创建具有构造函数的内置对象的实例const date = new Date()ne

2021-10-21 12:56:26 241

原创前端面试手写代码——JS函数柯里化

1 什么是函数柯里化2 柯里化的作用和特点2.1 参数复用2.2 提前返回2.3 延迟执行3 封装通用柯里化工具函数4 总结和补充

2021-10-20 16:31:43 480

原创前端面试手写代码——JS数组去重

JS数组去重代码总结

2021-10-19 10:12:23 240

原创 01 Spring Boot入门（Spring Boot 入门篇）

01 Spring Boot入门1 Spring Boot简介1.1 背景J2EE开发笨重，配置繁多（比如大量的XML配置），影响了开发效率复杂的部署流程第三方技术集成难度大1.2 解决Spring Boot是一个简化Spring应用开发的框架整合了整个Spring技术栈提供了J2EE开发的一站式解决方案1.3 Spring Boot 的优点快速创建独立运行的Spring项目以及与主流框架集成大量的自动配置，简化开发，也可修改默认值无需配置XML，无代码生成，开箱即用s

2020-11-17 11:44:19 126

空空如也

空空如也