JS面向对象逆向学习法，让难理解的统统一边去（1）～
2016-08-11 17:59
337 查看
对于面向对象我只能说呵呵了，为什么呢，因为没对象～～～
既然你看到了这里，说明你有一定的基础，虽然本系列文章并不会过多的讲述基础部分，请做好心理准备。
本篇比较简单，这篇文章的意义是让你明白学习面向对象所需要掌握东西，并且重点是什么。
------------------------------------------------
前世：
box：那个，你看看，你这代码也叫代码？你知道的，我们可是有理想的公司，再这样的话，你可以走了。
～～：T_T。
box：让你学面向对象，为什么不学！
～～：学啊，只是没学会嘛。
～～：其实也不是没学会，多少还是懂面向对象的，面向对象不就是：封装，继承，多态...。
box：那你不是懂这些嘛，为啥写的代码还是那么搓。
～～：虽然懂，但是运用不起来啊，完全没思路。
box：你前面提到了封装，那好，我问问你，在JS中怎么进行封装。
～～：可以通过函数封装。比如我想让两个任意的数字相加：
××××××××××××× 代码开始 ××××××××××××××××××
function together(a,b){
return a + b;
}
××××××××××××× 代码结束 ××××××××××××××××××
box：Ok，很好，其实你已经成功了一小步，你看你已经会了封装，那么我们再来看看继承，JS怎么实现继承。
box：js继承说起来的话得长篇大论了，其实我们一直都在用继承。
××××××××××××× 代码开始 ××××××××××××××××××
var a = 10;
function fn(){
alert(a); //10
};
fn();
function fn2(){
alert(a); //10
};
fn2();
××××××××××××× 代码结束 ××××××××××××××××××
box：你看我们在全局里面定义了一个变量a，但我们在函数中并没有定义变量a，但也可以打印出a这个变量，这说明我们这个函数继承了外部变量(专业术语：作用域链)。
虽然这可以实现继承但是变量都暴露在外部了，这肯定是不行的，一旦项目复杂了很可能污染全局，我们再来看一个：
××××××××××××× 代码开始 ××××××××××××××××××
function All()
};
All.prototype.toAlert = function(a,b){
alert(a,b);
};
All.prototype.abc = function(){
console.log('追梦子博客园');
};
var all = new All(5,6); //继承All的prototype上的所有方法和属性
××××××××××××× 代码结束 ××××××××××××××××××
~~：这就是面向对象吗？
box：可以这么说，也可以不这么说，但这是最核心的部分，因为面向对象的实现就是这些简单的东西组和起来的。
～～：但这些我还是不能联系起来啊，当然这只是刚刚开始，好戏还在后头···
结束：
以上是比较核心的东西，大家认真看看，因为内容比较多所有分做几章来写，后面会讲几个实例，然后是逆行学习法。
ps：建了个前端群一起学习一起进步，但是只加真心想学的，可以私信我。
既然你看到了这里，说明你有一定的基础，虽然本系列文章并不会过多的讲述基础部分，请做好心理准备。
本篇比较简单，这篇文章的意义是让你明白学习面向对象所需要掌握东西，并且重点是什么。
------------------------------------------------
前世：
box：那个，你看看，你这代码也叫代码？你知道的，我们可是有理想的公司，再这样的话，你可以走了。
～～：T_T。
box：让你学面向对象，为什么不学！
～～：学啊，只是没学会嘛。
～～：其实也不是没学会，多少还是懂面向对象的，面向对象不就是：封装，继承，多态...。
box：那你不是懂这些嘛，为啥写的代码还是那么搓。
～～：虽然懂，但是运用不起来啊，完全没思路。
box：你前面提到了封装，那好，我问问你，在JS中怎么进行封装。
～～：可以通过函数封装。比如我想让两个任意的数字相加：
××××××××××××× 代码开始 ××××××××××××××××××
function together(a,b){
return a + b;
}
××××××××××××× 代码结束 ××××××××××××××××××
box：Ok，很好，其实你已经成功了一小步，你看你已经会了封装，那么我们再来看看继承，JS怎么实现继承。
box：js继承说起来的话得长篇大论了，其实我们一直都在用继承。
××××××××××××× 代码开始 ××××××××××××××××××
var a = 10;
function fn(){
alert(a); //10
};
fn();
function fn2(){
alert(a); //10
};
fn2();
××××××××××××× 代码结束 ××××××××××××××××××
box：你看我们在全局里面定义了一个变量a，但我们在函数中并没有定义变量a，但也可以打印出a这个变量，这说明我们这个函数继承了外部变量(专业术语：作用域链)。
虽然这可以实现继承但是变量都暴露在外部了，这肯定是不行的，一旦项目复杂了很可能污染全局，我们再来看一个：
××××××××××××× 代码开始 ××××××××××××××××××
function All()
};
All.prototype.toAlert = function(a,b){
alert(a,b);
};
All.prototype.abc = function(){
console.log('追梦子博客园');
};
var all = new All(5,6); //继承All的prototype上的所有方法和属性
××××××××××××× 代码结束 ××××××××××××××××××
~~：这就是面向对象吗？
box：可以这么说，也可以不这么说，但这是最核心的部分，因为面向对象的实现就是这些简单的东西组和起来的。
～～：但这些我还是不能联系起来啊，当然这只是刚刚开始，好戏还在后头···
结束：
以上是比较核心的东西，大家认真看看，因为内容比较多所有分做几章来写，后面会讲几个实例，然后是逆行学习法。
ps：建了个前端群一起学习一起进步，但是只加真心想学的，可以私信我。
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- JSON解析首字母大写的字符串
- javascript 从定义到执行，你不知道的那些事
- 将key名不带双引号的JSON字符串转换成JSON对象的方法
- 把user对象里面的数据解析成json格式
- ExtJS4 树节点checkbox选中问题
- 把json格式的字符串存入到对象中
- Javascript缓存API
- 你未必知道的12个JavaScript技巧
- gson解析json
- JavaScript里的数组转化新方法Array.From
- JS15位或18位的身份证校验
- JavaScript里的循环方法：forEach，for-in，for-of
- javascript里的sleep()方法
- 41个Web开发者必须收藏的JavaScript实用技巧
- 前端程序员必须知道的高性能Javascript知识
- js插件开发规范
- Jsoncpp链接失败问题解决
- FastJSON
- form表单回车ajax提交
- 妙味课堂—JavaScript基础课程笔记