search

WinfredWang / note

MIT License
1 stars 0 forks source link

Web全栈知识点汇总 #2

Open WinfredWang opened 6 years ago

WinfredWang commented 6 years ago

目录

WinfredWang commented 6 years ago

知识

typeof/instanceof

typeof null => object

闭包

http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures.html

函数、变量的声明提升

https://segmentfault.com/a/1190000005794611

this/prototype/constructor

深拷贝

数组基本操作（清空，复制）

类，对象

继承实现

http://www.cnblogs.com/humin/p/4556820.html

函数(call, apply, bind)

正则表达式

作用域链

原型/构造函数/对象之间关系

构造函数都有一个原型对象prototype，原型对象包含一个指向构造函数的指针constructor，实例有一个指向原型对象的内部指针(__proto__)

原型链：

双向绑定机制（angularjs,vue）

跨域问题(jsonp, cros)

箭头函数与普通函数区别

没有this,argument,super,不能当作构造函数

函数柯里化

http://blog.jobbole.com/77956/

事件代理（数组情况如何考虑）

绑定事件方式

Commonjs, UMD, CMD及ES6模块规范及区别

WinfredWang commented 6 years ago

ES6

WinfredWang commented 6 years ago

ES5

WinfredWang commented 6 years ago

HTML

CSS

协议

WinfredWang commented 6 years ago

框架

双向绑定机制

效率提升工具

工程化&构建

自动化测试

typescript

WinfredWang commented 6 years ago

Node.js

第三方

WinfredWang commented 6 years ago

模块化

js诞生时

js刚开始时，js代码也不多，大家全是全局函数和变量，如下代码片段。后来

function demo() {
   console.log('I am born')
}

坏处：多人协作，容易出现函数覆盖

闭包写法：

(function(){
   function demo() {
      console.log('xxx')
   }
})()

好处：闭包内部封闭，不会覆盖别人方法，外部也无法修改。

面向对象写法：

(function(){

    function Person(name, age) {
        this.name = name;
        this.age = age;
    }

    Person.prototype.getName = function() {
        return this.name;
    }
    Person.prototype.getAge = function() {
        return this.age;
    }
    var p = new Person("huawei", 20);

    console.log(p.getName())
})()

模块化(commonjs规范为例)

a.js

var x = 5;
var addX = function (value) {
  return value + x;
};
module.exports.x = x;
module.exports.addX = addX;

b.js

var example = require('./a.js');

console.log(example.x); // 5
console.log(example.addX(1)); // 6

ES6 和TS类写法

class Point {
  constructor(x, y) {
    this.x = x;
    this.y = y;
  }

  toString() {
    return '(' + this.x + ', ' + this.y + ')';
  }
}
WinfredWang commented 6 years ago

布局

rem/em ，viewport，media （媒体查询） em相对父元素的 rem相对根元素html的font-size的大小，一般设置为屏幕的100/1或者10/1 rem/em异同以及优缺点 rem/vw结合倾向弹性布局， media用来做响应式，比如bootstrap网格

WinfredWang commented 6 years ago

css

1、盒模型 2、获取宽高

3、****

https://stackoverflow.com/questions/22675126/what-is-offsetheight-clientheight-scrollheight