Javascript的继承是基于原型的，之前理解的比较简单，直到最近在用 es5 写星级评分组件的时候遇到了些问题，解决之后理解深了一些。总结归纳，以便后用。

星级评分

原本的需求有俩个：

1. 根据后台返回的评价分数单纯进行5颗星的展示
2. 用户可以在5颗星上为商品进行打分，单击后上传

开始用最笨的方法，从业务出发很快速的把俩个需求都实现了。最后想着能不能利用继承来优化，方便后期扩展可以进行半星或者四分之一星评分。

具体效果如下：

利用原型分别实现满星与半星

变量

1. 声明不用，数据只使用一次或不使用就无需装到变量中

2. 变量命名，驼峰、简洁、易懂

3. 特定变量：

   1 2 3 4 5

   const MAX_INPUT_LENGTH = 8; if (value.length < MAX_INPUT_LENGTH) { // 一目了然，不能超过最大输入长度 .... }

4. 使用说明性的变量(即有意义的变量名)

        对于使用 vue 的同学来说，响应式、模版解析/渲染应该都很熟悉，vue 开发离不开这些特性。用了 vue 挺长时间了，写写总结。

响应式

创建一个普通的对象：

1
2
3
4
5

let t = {
    name: 't1'
    age: 19
}
console.log(t.age) // 19 那么如何监听age属性的访问与设置呢？

在es5中加入了一个api叫 Object.defineProperty,该api允许

本文为译文，原文地址：

Understanding the Virtual DOM

        我最近在写一些如何正确区分 dom 与 shadow dom 的文章。总的来说，dom 是HTML文档的基于对象的表示，以及操作该对象的接口。shadow dom 可以被认为是轻量级版本的 dom。它同样是以原生对象为基础的 html document，但是它并不是完整的。可能有些难懂，换一种说法来看，shadow dom 允许我们去将我们的 dom 划分的更小，更轻，可以跨文档使用。（这里作者想表达的意思是我们可以根据需要截取部分 dom 生成 vdom，而不用每次从 html 标签开始写 vdom 直到 html 标签闭合）

        另一个你可能遇到过的相似说法称 “shadow dom” 为 “virtual DOM”。尽管

之前也有 event loop 的概念，但一直都是琐碎的。直到阅读以下三篇文章后，琐碎的点串在了一起。

从浏览器多进程到JS单线程，JS运行机制最全面的一次梳理

这一次，彻底弄懂 JavaScript 执行机制

Event Loop的规范和实现

为了印象深刻，还是决定自己写一写。总结如下：

1、进程与线程的区别

1、什么是进程？

在计算机操作系统中，只有进程才能在系统中运行。所以要使程序运行就必须为其创建进程。当我们打开浏览器时就已经创建了进程。创建进程之后，系统会为其分配资源(内存等)供其使用。

进程是程序（指令和数据）的真正运行实例。若干进程有可能 …

        
跨域、缓存这些都是开发中常常遇到的，做些笔记供日后查阅。

CORS（Cross-Origin Resource Sharing）跨源资源分享

同源策略

同源策略（same-origin policy）是浏览器保障安全的一种方法。
主要指的是在同协议，同域名，同端口下才能访问资源。为什么要这样限制？假设某用户登陆了自己的网上网上银行，接着去访问了其他网站，如果没有同源策略的限制，那么其他网站就可以访问银行网站的cookie，而cookie一般存放着与用户相关的某些信息，这样用户的信息就会被泄漏或者被冒名顶替去访问网上银行。

HTTP 基础

网络间通信的大体流程

osi 模型较为复杂，一般常说的是五层模型：

物理层 -> 数据链路层 -> 网络层 -> 传输层 -> 应用层

        回顾了一下之前的代码，发现一个css中的坑即层叠顺序。什么叫层叠顺序？简单来说就是在屏幕上某一个位置堆积了很多 div 这些块哪个在上哪个在下的关系就是层叠顺序。（下面代码演示了三层堆叠）

        前一阵子接触一个新项目，用了vue中的ssr解决方案 — Nuxt.js。也算是小有感受，记录一些经验留后备用。

CSR & SSR

什么是 CSR ?

CSR => client-side-reder，即客户端渲染。具体过程如下：

• 用户请求页面，返回页面。此时页面只是模版页面
• 浏览器解析页面代码，读到js代码时，会根据我们所写的接口去请求数据
• 得到返回数据后使用模版（vue/react/ng/art-template）进行渲染

  什么是 SSR ?

        说到面向对象，大多数人都想到的是高级语言：c++、java，但是我认为对于一名coder来说不论什么语言，一定要有面向对象这种思想（封装、继承、多态），我们只需要用语言这个工具把思想表达出来即可。本文只讨论继承。

Javascript 中创建对象

new 关键字做了什么？

利用 new & 构造函数 创建新的对象。这个创建新对象的过程分为三步：

• 声明新的变量 basketball