Jack N @ GitHub

Full stack engineer, focus on: Angular/React, node.js/.Net

0%

javascript中常见的非人类(java/c#)知识

1. 概要

众所周期,javascript是一个很老的语言,起起伏伏,逐渐成为流行语言(主流语言),说白了,也是因为早期各个浏览器(ie/firefox/sarfari/chrome)互不妥协,谁也说服不了对方接收自己的标准,不过却都同时支持javascript。对于广大程序员来说,随着web流行度越来越高,那么为了同时支持大多数浏览器,那么使用标准的javascript成为趋势。而第三方(coffeescript, typescript, dart等)也都是选择将代码编译为JavaScript,然后在浏览器端执行。

作为从C#、java等语言转到javascript的同学来说,会发现不少C#、java的“我觉得应该是这样”的东西,JavaScript中却是不一样的。下面总结一下

2. this

对C#、Java等语言,this就是当前对象,但是javascript不是,简单来说:

  • 全局this 是window;
  • 函数this 是调用者;
  • 构造函数的this 是new 之后的新对象,
  • call 和 apply bind的this第一个参数

3. 原型链, prototype

  • 函数对象都包含prototype属性(函数的原型对象),其作用就是让该函数所实例化的对象们都可以找到公用的属性和方法;
  • constructor属性的含义就是指向该对象的构造函数
  • ①__proto__和constructor属性是对象所独有的;② prototype属性是函数所独有的,因为函数也是一种对象,所以函数也拥有__proto__和constructor属性。
  • JavaScript 的每个对象都继承另一个父级对象,父级对象称为原型 (prototype) 对象。
  • 每一个实例对象都有一个私有属性__proto__指向其构造函数的原型对象prototype;该原型对象也会作为实例对象有一个私有属性__proto__,层层向上直到一个对象的原型对象值为null。
  • 当访问一个对象的属性或方法时,js引擎会先查找该对象本身是否包含,如果没有,会去该对象的__proto__属性所指向的原型对象上找,如果没有,会继续向上一层找,直到某个对象的__proto__值为null,这就是原型链。
  • 每个构造函数都有一个prototype属性,指向另外一个对象,说明整个对象所有的属性和方法都会被构造函数所拥有。

4. new操作符都做了什么

new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象类型之一。

new Object()举例:

  1. 创建一个新对象
  2. 把新对象的原型指向构造函数的prototype
  3. 把构造函数里的this指向新对象
  4. 返回这个新对象

5. === VS ==

1
2
3
4
5
100 == '100' // true
0 == '' // true
0 == false // true
false == '' // true
null == undefined // true

很有意思吧, 看看这两个,是等效的:

1
2
obj == null
obj === null || obj === undefined

6. 闭包

在JavaScript中的一大特点就是闭包,很多高级应用(早期的jquery,现在的angular、vue)都要依靠闭包来实现。由于闭包会使得函数中的变量都被保存在内存中,会消耗很大的内存,导致页面的性能问题,甚至导致内存泄漏。建议不要或者少用闭包。

1
2
3
4
5
6
function outerMethod() {

var a = "some value";
var innerMethod = function() { console.log( a + "!") ;}
innerMethod();
}

7. 总结

  1. Javascipt 中有些内容和其他编程语言不一致,需要牢记
  2. JavaScript中拿不准的东西,可以简单测试一下,免得代码写好后出错。
  3. 简单测试,可以打开浏览器,直接F12(进入Dev Tools),再选择Console(控制台), 直接输入要测试的内容,查看返回结果



—————- END —————-






======================