为什么我在学习HTML\CSS的时候很快就能上手，可是JS我已经接触了2个月了，还是无从下手？

2019-12-25 09:42:45 佚名

hugh007

一般在学习前端的时候，我们会从html、css、js三大件入手，题主也是如此，但是为什么js这么难学，那是因为题主可能对js这门语言的基本知识掌握不够深入，另外一个对于语法糖的使用感到特别晦涩。现在我就来一点点剖析js，让题主从剖析中找到解决方法吧！

js令人感到晦涩点

我们看看js最最简单的赋值：

var js;js = 1;var result += js;

我们不知道这个'js'变量在赋值之前到底是什么类型，赋值过后才明白是个number，而且对应于强语言比如java ，你不知道这个number 是 Int Float 或者是double。这点很鸡肋。并且我分不清result 是常量还是变量，这在js语法里面界限也比较模糊，所以很多新手完全被概念模糊了。

再来看看定义域：

var context = this;function fun(){ var inner = this; var outer = context;}

定义域的this 指代范围不同，在不同方法中不能直接通过this获得整体js的上下文，这在开发中特别容易弄错导致各种各样的奇葩问题。

最后再看看语法糖：

var myFun = function(num){}var context = this;function use(){ myFun(10086);

window.myFun

= context.myFun;}

语法糖可以让人迷糊，这里myFun可能在初学者中及其容易弄混淆。“它到底是带参能还是不带参？”初学者一定会问这样的问题。

由于js语法模糊，语法糖特别能让人混淆，定义域不明确而且定义属性难以琢磨，使得初学者们望而却步。那么怎样才能让初学者们获得兴趣构建自己的应用呢？

直接上手vue、react等commonJS、ES6语法

时下es6语法流行，让js有了特别灵活且更好的语法糖。直接上手vue、react等项目能让自己养成一个良好的书写代码的习惯，自己分块，分清晰各类语法的用法特别好，而且编程思想特别清晰，比起一般的js要强太多。现在当下也是非常流行这类js代码。

赋值：

let change ;const constant = 1;change += constant;

let为定义变量，const为定义常量，在常量与变量中很明确谁是谁。

定义域：以vue项目为例：

export default {
data() {return {}},
methods:{ other(){}
use(){ this.other() }
}, created(){ this.other() }, mounted(){ this.other() }
}

直接以this来使用other方法，这个this就是vue的上下文，无论在生命周期哪个里面都能够使用。

直接学习TypeScript

TypeScript 是JavaScript的超集，其语法类似于C#，由C#之父Anders Hejlsberg开发，有类，有接口，有泛型，每个语法糖都特别规范。TypeScript特别适合写大型项目，维护起来非常方便，几个moudle相互引用，provider注入，@viewChild注解等各种语法糖都十分先进能让你学到非常多的东西，其代表框架是Angular 2+，现在都angular版本都快到8了，可以好好的去学习学习，antd也是非常好的前端框架。