CSS样式中BFC与float元素实际应用的关联

BFC的全称是Block formatting context直译为"块级格式化上下文"。是Web页面中盒模型布局的CSS渲染模式。它的定位体系属于常规文档流。

BFC的产生因素为：根元素，浮动，绝对定位元素，inline-block, table-cell, table-caption,和overflow的值不为visible的元素。如下图。

BFC

而关于float元素中产生的产生的块级元素浮动，对于拥有BFC属性的样式和内联元素（inline）以及文本，都不会被float块级元素所覆盖，也就是在实际应用，前者会跟后者同时完全展示，而非折叠或者覆盖展示。

参考链接：https://www.qwzyj.com/thread-116-1-1.html

想读更多 ->

现在的JavaScript框架教程

Roger 打开了手机上新闻类的 app，想寻找一些有趣的东西来看。他翻过关于如何更有创意的文章，翻过关于如何成为一个成功企业家的文章，翻过如何使文笔更好的文章。

当他正准备打开 Twitter 的时候，一个标题映入了他的眼帘：

丢掉 Angular, 忘掉 React，接下来是 Tupress---JavaScript 的终极框架。

“嗯，也许是时候学习一个框架了。”Roger 这样想着。这几个月以来，他一直在研究 JavaScript。为什么不看看这篇声明所有框架都是大惊小怪的文章都写了些什么？在浏览过这篇文章—文章中包括“直观”，“灵活”和“万能”之类的词语—之后，Roger 觉得值得一试。

他打开了他的 MacBook, 在 Google 中搜索“Tupress 教程”，并打开了最上面的搜索结果。该教程自称会教他如何构建一个双用户界面 app。完成后，该 app 可以将一个（2，2，2，2，2，2）的英语列表转换成法语列表（le 2, le 2, le 2, le 2, le 2, le 2）。

教程的第一步是安装 Tupress。然后，呃，Roger 还必须安装 Bisup—一个轻量级的包装器，虽然不知道它有什么作用。再然后，他必须安装 Claster，它提供了一层轻量的使用方法和中间件。虽然 Roger

想读更多 ->

npm 发布 2017 JavaScript 框架报告：React 占主导地位

npm 的联合创始人兼首席运营官 Laurie Voss 近日发布了 2018 年的第一个 JavaScript 现状报告，这一系列报告包含三部分，将会提供 JavaScript 发展趋势和实践的完整回顾。第一部分讲述了 2017 前端框架的现状，第二部分将讲述 React 的生态系统，第三部分将对后端框架进行讲述。目前，第二和第三部分尚未发布。

Laurie Voss 说，JavaScript 社区在编程语言史上以前所未有的速度增长着，npm 中的包也随之增长。npm 作为开发者分发和发现 JavaScript 代码的中心枢纽，我们可以看到应用程序开发者编写代码以及他们使用工具的趋势。

一起看看 2017 JavaScript 前端框架的回顾吧。

主要的前端框架

想读更多 ->

javascript成神之路(3)：到底有没有JSON对象

摘要：每天坚持一点点，胜利就会在你眼前(文章后面有惊喜)

前言：在我工作的过程中，很多小伙伴多会说：把字符串转化为JSON对象，把JSON对象转化成字符串等类似的话，前一段时间，我看了一篇关于JSON方面的文章，是一个外国大神写的，让我也深有体会，在这里我就谈一下我的感受。

json是什么？

很多的javascript开发人员都错误地把javascript对象字面量（Object Literals）称为JSON对象（JSON Objects），因为他的语法和JSON规范里描述的一样，但是该规范里也明确地说了JSON只是一个数据交换语言，只有我们将之用在string上下文的时候它才叫JSON。在这里我们在这里了解几个概念：

他们是固定的值，不是变量，让你从“字面上”理解脚本。

字符串字面量是由双引号（"）或单引号（'）包围起来的零个或多个字符组成的。

对象字

想读更多 ->

做好javascript程序员，就要专心搞对象Object

对象object

javascript中对象的属性和方法私有性都是利用函数可以提供局部作用域的特性来实现的。

var Obj={};//声明一个对象;

(function(){

var name="这是私有属性";//此为函数局部变量；

var i=0;

function index(){return i+=1;}

function getName(){return name;}//外部访问私有属性接口

Obj={

Id:index,

g

想读更多 ->

18个JS简写技巧！让你写代码速度翻倍！「浙江优就业」

代码精炼是每个有追求的程序所向往的，本文浙江优就业的小U老师总结了19个JavaScript的简写技术，其中包括三元操作符、短路求值简写方式、声明变量简写方法等等，希望对你有帮助。

1.短路求值简写方式

当给一个变量分配另一个值时，想确定源始值不是null，undefined或空值。可以写撰写一个多重条件的if语句。

或者可以使用短路求值方法：

原型对象(person.prototype 原型对象还有constructor属性（指向构造函数对象）)

拥有__proto__、prototype属性（指向原型对象）。

Function、Object、Array、Date、String、自定义函数

原型对象

每创建一个函数都会有一个prototype属性，这个属性是一个指针，指向一个对象（通过该构造函数创建实例对象的原型对象）。原型对象是包含特定类型的所有实例共享的属性和方法。原型对象的好处是，可以让所有实例对象共享它所包含的属性和方法。第一块中有提到，原型对象属于普通对象。Function.prototype是个例外，它是原型对象，却又是函数对象，作为一个函数对象，它又没有prototype属性

1.什么是正则表达式

正则表达式是一个描述字符模式的对象。

正则表达式是具有特殊语法的字符串，用来表示指定字符或字符串在另一个字符串中出现的情况。

正则表达式是指一个用来描述或者匹配一系列符合某个句法规则的字符串的单个字符串。

作用：验证字符串、查找字符串、替换字符串、提取字符串

典型场景：表单验证、网络爬虫、编写底层框架、日志分析

2.正则的构成

定界符 // 模式规则 模式修正符 gim

例如 /javascript/gi

注意事项： 正则是一门独立的语言，各种语言都支持对正则的使用， 在JavaScript中，直接使用//作为定界符即可，不需要加单引号或双引号，在PHP中，则需要加上单引号或双引号，最好是使用单引号。

正则有两个系列，一是perl系列，二是posix系列。目前使用较多的是perl系列，效率稍高，js实现的只有perl系列，而php则两种都实现了。

庸人自学JavaScript（四）

又到了一周的第一天，我们大家又开始忙碌上班了吧，我也的继续更新学习javascript的内容了，那么开始吧！

JavaScript变量：变量是用于存储信息的"容器"。

就像代数那样

x=5，y=6，z=x+y

在代数中，我们使用字母（比如 x）来保存值（比如 5）。

通过上面的表达式 z=x+y，我们能够计算出 z 的值为 11。

在 JavaScript 中，这些字母被称为变量。

JavaScript 变量

与代数一样，JavaScript 变量可用于存放值（比如 x=5）和表达式（比如 z=x+y）。

变量可以使用短名称（比如 x 和 y），也可以使用描述性更好的名称（比如 age, sum, totalvolume）。

变量必须以字母开头

变量也能以 $ 和 _ 符号开头（不过我们不推荐这么做）

变量名称对大小写敏感（y 和 Y 是不同的变量）

JavaScript 数据类型

JavaScript 变量还能保存其他数据类型，比如文本值 (name="Bill Gates")。

在 JavaScript 中，类似 "Bill Gates" 这样

想读更多 ->