javascript原理,javascript工作原理

零基础如何迅速学习前端

给你几点建议和学习路线，参考一下：

为秀英等地区用户提供了全套网页设计制作服务，及秀英网站建设行业解决方案。主营业务为网站设计制作、成都网站设计、秀英网站设计，以传统方式定制建设网站，并提供域名空间备案等一条龙服务，秉承以专业、用心的态度为用户提供真诚的服务。我们深信只要达到每一位用户的要求，就会得到认可，从而选择与我们长期合作。这样，我们也可以走得更远！

1、作为一个初学者，你必须明确系统的学习方案，我建议一定有一个指导的人，全靠自己学，放弃的几率非常大，在你对于web前端还没有任何概念的时候，需要一个人领进门，之后就都靠自己钻研，第一步就是确定web前端都需要哪些内容，并且在多少时间内学完，建议时间6个月保底。

2、视频为主，书为辅。很多初学者在学习前端的时候非常喜欢去买书，但是最后的结果是什么？看来看去什么都不会写，所以在这里给大家提醒，书可以看，但是是在建立于你已经对于某个知识点有了具体操作的执行后，在用书去巩固概念，这样更加利于你对于知识的理解。

3、对于学习技术来讲，掌握一个学习方法是非常重要的，其实对于学习web前端来讲，学习方法确实很多都是相通的，一旦学习方法不对，可能就会造成“方法不对，努力白费”。其实关于这方面还是很多的，我就简单说个例子，有的人边听课边跟着敲代码，这样就不对，听课的时候就专心听，做题的时候就专心做题，这都是过来人的经验，一定要听。根据每个人的不同，可能学习方法也会有所出路，找到适合你自己的学习法方法是学习的前提。

4、不建议自己一个人瞎学，在我了解学习编程的这些人来看，从零基础开始学并且最后成功做这份工作的其实并没有几个，我觉得大部分原因就是因为他们都不了解web前端是干什么的，学什么的，就盲目的买书看，到处找视频看，最后看着看着就放弃了，所以我建议初学者在没有具体概念之前，还是找有经验的人请教一下，聊过之后你就会知道web前端具体是干什么的，该怎么学，这是我个人的小建议，可以不采纳。

自学前端的路线：

第1阶段：前端页面重构(4周)

内容包含了：(PC端网站布局项目、HTML5+CSS3基础项目、WebApp页面布局项目)

第2阶段：JavaScript高级程序设计(5周)

内容包含：(原生JavaScript交互功能开发项目、面向对象进阶与ES5/ES6应用项目、JavaScript工具库自主研发项目)

第3阶段：PC端全栈项目开发(3周)

内容包含：(jQuery经典交互特效开发、HTTP协议、Ajax进阶与PHP/JAVA开发项目、前端工程化与模块化应用项目、PC端网站开发项目、PC端管理信息系统前端开发项目)

第4阶段：移动端项目开发(6周)

内容包含：(Touch端项目、微信场景项目、应用Angular+Ionic开发WebApp项目、应用Vue.js开发WebApp项目、应用React.js开发WebApp项目)

第5阶段：混合(Hybrid,ReactNative)开发(1周)

内容包含：(微信小程序开发、ReactNative、各类混合应用开发)

第6阶段：NodeJS全栈开发(1周)

内容包括：(WebApp后端系统开发、一、NodeJS基础与NodeJS核心模块二、Express三、noSQL数据库)

入门书籍：

《JavaScript DOM 编程艺术》

超级前端畅销书，作为前端程序员必读两遍以上的书籍，这本书籍特别适合初学前端的新人，前端的核心技术就是JavaScript，同时也是前端的难点。而这本书非常适合入门，通俗易懂，生动的案例可以让初学者更好的进行理解。所提及的很多编程思想却适合低中级层次的前端开发者学习。

《JavaScript权威指南》

同样是前端程序员必读的一本书籍，不仅适合初学者，还适合那些已经在做前端工作的程序员进行随时翻阅。里面涵盖了JavaScript的所有内容，以及web浏览器所实现的JavaScript API。对于了解js的基础知识，比如对象，数组，语法，作用域，闭包等等都很有帮助。

《JavaScript 高级程序设计》

如果你想把JavaScript非常完全的系统学习一遍，我强烈推荐这本书，这本书可以一直保留，在用这本书的过程中还可以画下重点，以后可以作为参考，是工作中非常强力的帮手。面试的时候也可以很好的应用上，我们俗称的“红宝书”。

《你不知道的JavaScript》

这本书不适合前端的初学者，想要深入的了解JavaScript原理，这是每一个前端程序员必须要研究的一本书籍。要让不求甚解的JavaScript开发者迎难而上，深入语言内部，弄清楚JavaScript每一个零部件的用途。如果可以把这本书吃透，那么以后理解任何东西都可以很快的理解和掌握。

《Vue.js权威指南》

Vue作为现在前端的主流框架，在国内应用最为广泛，所以了解Vue原理必须要啃一本Vue的书籍。我之所以推荐这本，是因为这本书对于引导初用Vue的开发者有着质的提升。从基础知识到主流打包以及源码解析，还有很多实践的案例，都是一本不错的实用性书籍。主要内容包括数据绑定、指令、表单控件绑定、过滤器、组件、表单验证、服务通信、路由和视图、vue-cli、测试开发和调试、源码解析及主流打包构建工具等。该书内容全面，讲解细致，示例丰富，适用于各层次的开发者。

《编程之美》

无论是什么岗位的程序员，必读的一本书籍，没有读过这本书的程序员几乎都是假程序员。这本书有60道算法和程序设计题目，这些题目大部分在近年的笔试，面试中出现过，或者是被微软员工热烈讨论过。作者试图从书中各种有趣的问题出发，引导读者发现问题，分析问题，解决问题，寻找更优的解法。可以大幅度提高自己的编程思维和对于这个行业的深入思考，最终变成技术大牛。

相关的视频教程你需要的话，可以加一下我问我要，视频教程、文档资料、源码教程都有。

js的执行原理是什么？

JS是解释执行的，即读取一个语句就执行一个。以前的严格JS是以分号为语句的分隔符，但现在一些浏览器已经接受以换行符为分隔符（似乎是很多人喜欢用基于对象的编程了，而在JS中写对象的函数是需要加分号的，所以很多人都爱忘）。

JS本身只提供语法解析与少部分内部函数支持，其他的均由宿主支持。比如在网页JS中的window, document, navigator等对象，均是由浏览器提供基于其它语言的代码，这些代码通常被隐藏，但很大程度上决定了JS的运行效率。如果你有兴趣，打开Chrome，按F12，调处Console，然后输alert（注意没有()），你就会发现[native code]这个东西。

请说明javascript的继承机制和java继承机制的区别

一，先来说说javascript的继承机制的几种方式：

1，原型链继承：

优点：从instanceof关键字来看，实例既是父类的实例，又是子类的实例，看起来似乎是最纯粹的继承。

缺点：子类区别于父类的属性和方法，必须在Sub.prototype = new Base();这样的语句之后分别执行，无法被包装到Sub这个构造器里面去。例如：Sub.prototype.name = “sub”；无法实现多重继承。

2，构造继承：

优点：可以实现多重继承，可以把子类特有的属性设置放在构造器内部。

缺点：使用instanceof发现，对象不是父类的实例。

3，实例继承：

优点：是父类的对象，并且使用new构造对象和不使用new构造对象，都可以获得相同的效果。

缺点：生成的对象实质仅仅是父类的实例，并非子类的对象；不支持多继承。

4，拷贝继承：

优点：支持多继承。

缺点：效率较低；无法获取父类不可枚举的方法。

二，java继承机制：

1，java里的类不能多重继承，如果一个类一旦继承了它的父类，那么它就别想再继承别的类。一个儿子只能有一个老爸，原本设计是没错的。可是在实际应用中，就会出现各种问题。

2，java里有更好的接口，接口从本质上来说可以更好的代替继承。实现像C++里一样的宏定义的功能，把你想要的东西都抽象在接口里，让具体的类去实现这些功能。

三，综上可以看出java不能多继承，javascript可以，但是javascript没有接口这一说话，也有局限性，各有千秋吧。

JavaScript对象和原型和构造函数怎么理解？

对象

对象对象是已命名的数据集合。其中“已命名的数据”指的就是它的属性和方法，如：

var a = { val : 1 , func:function(){}}

对象 a 拥有两个已命名的数据 val 和 func 。

访问对象的成员可以使用 . 或 [ ] ，其中 . 运算符要求它右边必须是合法的标示符，而 [ ] 运算符，对它的操作数并无要求，任何合法的值都可以，如：

a.val ; // 1

a.func() ; // undefined ;

a["x"] = 2 ; // a : { val : 1 , func:function(){} , x : 2 }

a[null] = 3 ; // a : { val : 1 , func:function(){} , x : 2 ,null : 3}

2.原型

对象有一个私有的属性 __proto__，持有其原型的引用。

对象的原型，也是一个对象。对象与它的原型的关系就是：数据共享，这体现在对象属性值的查找过程。访问对象的属性，首先在它自定义的数据集合中寻找，找到后，立即返回该值；如果没有找到，则到它的原型中寻找，找到后，立即返回值；....；如果一直到原型链（原型还可以有原型）的末端都没有找到，则返回 undefined。

var b = { bPro : "in b" } ;

a.__proto__ = b ;

alert( a.bPro ) ; // in b ;

如果一个对象没有显式的指定原型，那么它的原型默认是 Object.prototype ，而 Object.prototype.__proto__ = null ,所以它就是所有原型链的结尾。

为对象添加了一个在原型中存在的属性，则会覆盖对原型属性的访问。

a.bPro = "in a" ;

alert(a.bPro) ; // "in a"

alert(a.__proto__.bPro) ; // "in b"

可以看到，修改对象，并未影响到原型，更不会影响到共享同一个原型的其他对象。

3. 构造函数

任何函数都可以用作构造函数，只要使用 new 运算符进行调用即可。

构造函数的原理，就是创建一个对象，并将函数的属性 prototype 赋给刚刚创创建的这个对象的 __proto__ 属性、传递原型，然后将 this 指向它；执行函数体，函数体中形如 this.x = y 的代码都是在给这个刚创建的对象添加成员；最后这个新创建的对象会作为 new 表达式的值返回。如下：

function obj(xValue){

this.x = xValue ;

}

obj.prototype = { pro : "in prototype" } ;

var a = new obj(1) ; // { x : 1 }

alert(a.pro) ; // "in prototype" 

a.__proto__ === obj.prototype // true;

当然，函数也可以返回值。但只有 Object 类的实例（包括子类实例）才会生效，其他的值都会被忽略，继续返回刚创建的对象（即使函数体中一个 this 都么有）。

function func( ret ){

this.x = 5 ;

return ret;

}

var a = new func() ; // { x : 5 } 

var b = new func( null ) ; // { x : 5 } 

var c = new func( { } ) ; // { } 

var d = new func( [] ) ; // [] 

var e = new func( 1 ) ; // { x : 5 } 

var f = new func( new Number( 1 ) ) ; // Number

4. Bulalalal

后面的我没看懂，查了查，发现内容也没啥新鲜的。

如果一个拥有返回值，且返回的是 Object 类的实例（包括子类实例），那么使用不使用 new 运算符的结果都是一样的。同其他语言中一样，具有这样功能函数，都叫做工厂函数，更复杂的创建过程可能不叫这个名字，但也一定会包括"工厂"二字。

function obj(x , y ){

return { proX : x , proY : y } ;

}

虽然说懂了原理，其他的都是形式问题。但其实我也觉得有必要深入了解一下，毕竟和人交流的时候，不能让一些其实没多大意义的名词给难住、影响沟通效果。

只是我有点累了，手指头快麻了，我去瞅瞅别的东西了。（还有，我已不做程序员好多年，新东西学不动了）

参考文章：对象  推荐你将函数那一章也看看。

在javascript中什么是事件委托 原理是什么

要了解委托的原理，首先要理解DOM事件的过程。

Dom事件分为两个阶段，如图：

事件捕获阶段（红色箭头顺序）

事件冒泡阶段（绿色箭头顺序）

在事件捕获阶段，事件源依次从defaultView（可以理解为整个页面）一直传播到具体的目标（target）。从广泛到具体。

在事件冒泡阶段，事件源依次从target传播到defaultview。从具体到广泛，范围越来越大，像冒泡过程一样，气泡越来越大（范围越来越大）

而事件委托就是利用的DOM事件的事件捕获阶段。把具体dom上发生的事件，委托给更大范围的dom去处理。好比送信员，如果每次都把信件送给每一户，非常繁琐。但是如果交给一个大范围的管理者，比如小区的传达室，那么事情会变得非常简单。事件委托就类似这种原理，我页面中有很多按钮，如果不使用事件委托，我只能在每个按钮上注册事件。非常麻烦。但如果我把事件注册在一个大范围的div（假设所有的按钮都在这个div中），那么我只要注册一次事件，就可以处理所有按钮（只要按钮包含在上述div中）事件的响应了。

JavaScript 中原型继承（prototype-based inheritance）的原理是怎样的？

构造函数=function(){};

原型对象={属性甲:1,属性乙:2};

构造函数.prototype=原型对象;

新建对象=new 构造函数();

新建对象.属性甲=0;

这样新建对象就继承了原型对象，并在自身内覆盖了一层私有属性，但并不改变原型对象的任何属性。

此时新建对象本身相当于{属性甲:0}（算上隐藏的不可枚举属性是{属性甲:0,constructor:构造函数}），但是如果访问新建对象.属性乙这个自身不存在的属性，则会上溯到其原型对象的同名属性。

原型对象的属性改变会对所有包括之前创建的新建对象统一有效。方便管理且节省空间。

原型对象亦可层层继承（原型对象本身也可以是基于更上层原型的对象构造的）。而没有继承任何对象的最顶层对象（也即是={}这种最常见的定义形式，等同于=new Object()）的constructor就是Object这个原生超级根对象构造器。