Chef_Front-CSDN博客

原创 CMD规范

对于浏览器端，为了实现JavaScript模块化开发，提出了AMD和CMD规范。本文介绍一下CMD规范包含的内容，主要介绍内容包含书规则和引用方式。define—–定义顾名思义，define是用来定义模块的，它是一个全局函数，可以接受不同形式的参数。形式:define(name?,depend?,constructor)//例子define('helloWorld',[...

2018-08-07 20:43:47 1990

原创 React Refs用法

Refs介绍Refs提供了一种访问在render方法中创建的DOM节点或者React元素的方法。在典型的数据流中，props是父子组件交互的唯一方式，想要修改子组件，需要使用新的pros重新渲染它。凡事有例外，某些情况下我们需要在典型数据流外，强制修改子代，这个时候可以使用Refs。下面我将通过例子的方式详细介绍如何设置Refs以及如何访问Refs。Refs设置设置Refs...

2018-04-25 17:14:48 3460

原创 React Context和高阶组件HOC用法

前言本文将通过官方实例，组合运用Context和高阶组件，并给出实例代码的方式详细介绍Context、高阶组件的概念和用法。Context在典型的React应用中，数据是通过props属性一层层的由上向下传递。但是对于应用中很多组件都需要使用的值（比如说：页面的主题，页面语言选择），如果还是通过props属性一层层的传递下来，会非常繁琐。Context通过组件树提供了一种传...

2018-04-25 15:16:13 1515

原创 JavaScript与Dijkstra 最短路算法

背景Floyd 最短路算法用于求解任意两点的最短路径，称为“多源最短路”。下面我们介绍指定一个点到其他各个顶点的最短路径，叫做：单源最短路径。下面我们还是先给出本篇文章讲解依赖的图：数据结构同样，我们使用一个二维数组存储上述图的信息。求解过程根据上图：我们可以得到初始矩阵path：前面我们说过dijkstra是“单源最短路径”，在讲解求解过程...

2018-04-24 21:57:14 2798

原创 JavaScript与Floyd最短路算法

背景NBA超级后场组合灯泡组合(Harden和CP3)休赛期来到中国玩耍，他们两人打算在四个城市进行玩耍，最后他们选择了北京、上海、西安和长沙。假设这四个城市之间有些城市之前有航线，而有些城市之间没有航线。为了方便行程，出发前，他们想要知道任意两个城市之间的最短路程。如果下图就是航线图：数据结构我们使用一个二维数组Path来存储上述图的信息。比如说0号城市到1号城市之间的距...

2018-04-22 16:28:56 571

原创 JavaScript判断plain object

Plain Object: 指的是通过字面量形式或者new Object()形式定义的对象。通过以下代码可以进行判定。 function isPlainObject(obj) { if (typeof obj !== 'object' || obj === null) return false let proto = obj while (Object.getPrototy...

2018-03-28 15:24:10 5816

原创 JavaScript拖放实现

拖放概念：点击某个对象，并按住鼠标按钮不放，将鼠标移动到另一个区域，然后释放鼠标按钮将对象放在这里。基本思路：创建一个绝对定位的元素，使其可以用鼠标移动。本文通过实例代码讲解如何实现拖放功能。HTML代码实现在写js代码之前，我们先创建一个用于拖动的红色方块。<!DOCTYPE html><html> <head&...

2018-03-26 11:37:21 467

原创 JavaScript自定义事件--高级技巧

观察者模式事件是JavaScript和浏览器交互的主要途径。事件是一种叫做观察者的设计模式，这是一种创建松散耦合代码的技术。观察者模式：由两类对象组成，主体和观察者，主体负责发布事件，观察者通过订阅这些事件来观察主体。该模式的一个重要概念是主体并不知道观察者的任何事情，也就是说即使观察者不存在，主体也可以独自存在并正常运作。而观察者知道主体，并能注册事件的回调函数。示例：当涉及DOM时...

2018-03-26 11:01:03 8703

原创 JavaScript跨浏览器事件处理程序、事件对象

var EventUtil = { addHandler:function(element,type,handler){ if(element.addEventListener){ element.addEventListener(type,handler,false); } else if(element.attac...

2018-03-25 16:16:41 217

原创 JavaScript二叉树遍历

本文主要讲述二叉树的先序、中序、后序递归遍历及非递归遍历，并讲述如何使用JavaScript实现遍历逻辑。下面，我们通过一个例子来回顾一下先序、中序、后序遍历：上面二叉树先序、中序、后序遍历结果分别为：先序：ABCDEF 中序：CBDAEF 后序：CDBFEA从上例可以总结出先序、中序、后序的规则：先序:遍历到一个节点时，输出节点的值，然后遍历此节点...

2018-03-21 11:15:59 595

原创 JavaScript私有变量

私有变量任何在函数中定义的变量，都可以认为是私有变量。私有变量包括：函数的参数、局部变量、函数内部定义的其他函数。我们把有权访问私有变量和私有函数的公有方法称为特权方法。利用私有变量，可以隐藏那些不应该被直接修改的数据。示例：function Person(name){ this.getName = function(){ return name...

2018-03-19 23:07:17 347

原创 JavaScript与Floyd 最短路算法

背景NBA超级后场组合灯泡组合(Harden和CP3)休赛期来到中国玩耍，他们两人打算在四个城市进行玩耍，最后他们选择了北京、上海、西安和长沙。假设这四个城市之间有些城市之前有航线，而有些城市之间没有航线。为了方便行程，出发前，他们想要知道任意两个城市之间的最短路程。如果下图就是航线图：数据结构我们使用一个二维数组Path来存储上述图的信息。比如说1号城市到二号城市之间...

2018-03-19 11:39:46 601

原创 JavaScript创建对象的几种模式

前言对象字面量以及Object构造函数均可以创建单个对象，但是这样的方式有一个致命缺点，会产生大量的重复代码，为了解决这个问题，人们开始使用工厂模式创建对象。工厂模式工厂模式抽象化了创建具体对象的过程，ES5中无法创建类，开发人员就创建了一种函数，用函数来封装创建对象的细节。function createPerson(name,age){ var obj = new Object()

2017-09-13 22:48:28 222

原创第二节：CSS选择器

规则结构每个规则分为两个基本部分：选择器和声明块。声明块由一个或多个声明组成，每个声明则是一个属性-值对，每个样式表由一系列规则组成。如图：元素选择器最常见的选择器往往是HTML元素，但也不完全是这样，XML元素当然也可作为元素选择器。从上可以总结出来，文档的元素就是最基本的选择器。声明和关键字声明是一个属性-值对，属性值要么是关键字要么是该属性可取关键字的一个列表（关键字之间用空格分开），当声

2017-09-09 19:26:21 247

原创第一节：CSS术语和文档

CSS可以缩减文件大小术语元素：文档结构的基础，如p，table,span,a,div替换元素与非替换元素：替换元素指用来替换元素内容的部分并非由文档内容直接表示，如img，input。非替换元素，大多数元素属于非替换元素，其内容由用户代理（浏览器）在元素本身生成的框中显示。元素显示角色：块级元素，会填充其父元素的内容区，旁边不能有其他元素，相当于一个“分隔符”，如p，div。行内元素

2017-09-09 19:21:02 266

原创 js窗口尺寸获取常用属性

window.innerHeight（innerWidth）：表示可见区域的高度（宽度），如果底部（右侧）有滚动条，会把底部（右侧）滚动条的高度（宽度）计算进去，此方法适用于标准浏览器及IE9+。document.documentElement.clientHeight（clientWidth）：表示可见区域的高度（宽度），不会把滚动条的高度宽度计算进去，此方法适用于标准浏览器及低版本

2017-09-07 20:32:19 14626

原创 ES6-let 与 const

1.let命令基本概念let语法类似于var，不同点在于let定义的变量只在定义它的代码块中有效。{var a = 1;let b = 2;}a // 输出1b // 报错 Uncaught ReferenceError: b is not definedvar 定义的变量要么为全局变量，要么是在函数之中的局部变量。上述代码块中的

2017-09-07 20:29:55 427

Chef_Front的博客