- 博客(17)
- 收藏
- 关注
RSS订阅
原创 手写系列---New
关于new做了什么 大致分为三步： 1.以构造器的prototype属性为原型，创建新对象； 2.将this(可以理解为上句创建的新对象)和调用参数传给构造器，执行； 3.如果构造器没有手动返回对象，则返回第一步创建的对象 根据以上思路，自定义一个New方法，来模拟new的能力 /* 将构造函数以参数形式传入 */ function New(func) { let res = {} ...
2020-03-19 13:18:11
119
原创 一道前端笔试难题---对New的思考
function Foo(){ getName = function () { console.log("1") } return this; } Foo.getName = function () { console.log("2") } Foo.prototype.getName = function () { console.log("...
2020-03-18 23:16:42
163
原创 面试题---关于绑定规则的思考
题目如下 var name = 'global'; var obj = { name: 'local', foo: function(){ this.name = 'foo'; }.bind(window) }; var bar = new obj.foo(); setTimeout(function() { console.log(window.n...
2020-03-18 21:37:19
550
原创 Css居中布局（除flex） 总结
Css居中布局 总结 水平方向居中 1.text-align:center （父元素）+display:inline-block(子元素) 优点： 浏览器兼容性比较好（语法都是css2） 缺点： Text-align属性具有继承性，导致子级元素文本也是居中布局的 （需要单独再设置子元素） 2.display:table/block + margin:0 auto（子元素） 优点： 只需要对子级元素...
2020-03-18 13:16:54
1188
原创 javascript设计模式--基本概念
链式调用和在原型上添加方法 Function.prototype.addMethod = function(name,fn){ this[name] = fn return this //链式增加 } var methods = new Function() methods.addMethod('checkName',function(){ //验证用户名 cons...
2020-04-21 20:39:36
193
原创 javascript设计模式--单例模式
惰性单例 延迟创建。对于一些需要频繁创建和销毁的对象，此模式无疑可以提高系统的性能。类似于 懒加载 var LazySingle = (function(fn){ var _instance = null function Single(){ //这里定义私有属性和方法 return { publicProperty:'1...
2020-04-18 23:51:02
209
原创 javascript设计模式---原型模式
用原型实例指向创建对象的类，可以共享原型中的方法和属性。 var LoopImages = function(imgArr,container){ this.imageArray = imgArr this.container = container } LoopImages.prototype = { createImage : function () { ...
2020-04-18 22:32:01
187
原创 自绘图搞懂js原型链
一道题 function Parent(){ this.name = 'parent' } function Tom(){ this.name = 'tom' } Parent.__proto__.print = function () { console.log(this.name) } Parent.print() Tom.print() var parent = ...
2020-03-28 17:00:19
180
原创 前端常见面试题（网络）
一个完整的 URL 是由哪几个部分组成的 protocol： protocal即协议，https是一种协议也是URL的开头部分 协议包括FTP，HTTP，file等等 hostname: hostname 即主机名 指存放资源的服务器的域名系统(DNS)主机名或是IP地址 如www.baidu.com关于域名和DNS在后面会有详细的介绍 port port即端口，省略时使用协议的默认端口 需要知...
2020-03-28 12:22:30
455
1
原创 搞懂BFC
什么是BFC Block Formatting Contexts（BFC） 块级元素格式化上下文 它决定了块级元素如何对它的内容进行布局，以及与其他元素的关系和相互关系 块级元素：父级（是一个块元素） 内容：子元素（是一个块元素） 其他元素：与内容同级别的兄弟元素 相互作用：BFC里的元素与外面的元素不会发生影响 常用触发条件 浮动元素：float除none以外的值 绝对定位元素：pos...
2020-03-25 22:49:33
159
原创 electron入门（配环境）
克隆项目： git clone https://github.com/electron/electron-quick-start.git 安装依赖的包： cd到electron-quick-start文件夹，执行命令： npm install 运行程序： npm start 其中安装包（electron-v1.8.6-darwin-x64.zip）下载特别慢，基本下载不下来 可以删...
2020-03-23 18:39:30
193
原创 菜鸟React（二）
条件渲染 方法一（变量）： //LoginControl.js import React from 'react' function LoginButton(props) { return ( <button onClick={props.onClick}> Login </button> ); } ...
2020-03-23 16:55:22
140
原创 菜鸟React（一）
项目搭建 第一步 全局安装脚手架 npm i create-react-app –g 全局安装脚手架 第二步 npm config set registry https://registry.npm.taobao.org 设置cnpm为默认下载服务器（加快下载速度） 第三部 create-react-app react-demo 第四部 进入目录 npm run start React组件介绍 R...
2020-03-22 23:59:42
138
原创 手写系列---map（高阶函数）
我们都知道map函数是数组里面的常用函数，先看看map函数具体做了什么 var array = [1,2,3,4] /* map方法第一个参数为一个回调函数，该函数拥有三个参数 //第一个参数代表array数组中的每一项 //第二个参数代表当前遍历的索引值 //第三个参数代表数组本身 该函数中的this指向map方法的第二个参数，如果无则this指向丢失 */ var newArray = ar...
2020-03-19 20:50:03
1227
2
原创 手写系列---throttle
所谓节流，就是指连续触发事件但是在 n 秒中只执行一次函数。节流会稀释函数的执行频率。 实现方式一：时间戳 function throttle(func,wait) { let previous = 0; return function () { let now = Date.now() let context = this; l...
2020-03-19 19:46:15
181
原创 js事件循环机制
在进入事件循环机制前，先回顾下基础知识 函数调用栈 执行上下文 javascript代码在执行时，会进入一个执行上下文。执行上下文可以理解 为当前代码的运行环境。 javscript中的主要三种运行环境 全局环境（代码运行起来后会首先进入全局环境） 函数环境（当函数被调用执行时，会进入当前函数中执行代码） eval环境（不建议使用 不详述） 可以预见的是，在一个JS程序中，必定会出现多...
2020-03-19 17:14:16
114
原创 手写系列---debounce
函数防抖（debounce）：当持续触发事件时，一定时间段内没有再触发事件，事件处理函数才会执行一次，如果设定的时间到来之前，又一次触发了事件，就重新开始延时。如下图，持续触发scroll事件时，并不执行handle函数，当1000毫秒内没有触发scroll事件时，才会延时触发scroll事件。 function add() { div.innerHTML = parseInt(div...
2020-03-19 00:27:37
407
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人