javascript没那么简单
来源: 阅读:652 次 日期:2015-04-27 10:29:54
温馨提示: 小编为您整理了“javascript没那么简单”,方便广大网友查阅!

写此文目的是为了让更多的程序员理解javascript的一些概念,对是理解不是了解

我们已经了解得够多了,该是向深入理解的方向靠拢的时候了

为什么这么说,前些日子收到面试邀请,那就去试试呗,有几年没有面试过了吧

和面试官坐在沙发上,聊天式的他问我答,以下就是几个javascript方面的问题

>请创建一个对象,包括几个公有属性,接下来是为对象创建一个公有方法,然后为对象创建几个私有属性,一个私有方法

说实话,这几个问题我默名其妙,要是他让我用jquery写个拖动插件什么的,我估计我能写挺好,原生的javascript,晕,虽然我看过jquery源码解读,但这些基本概念要命

稍后,我会在正文中将答案写出来

如果面试官在看,说声谢谢,面试完之后我就去深圳购书中心买javascript去了,好贵,呵呵,看中之后,到卓越定了一个《javascript王者归来》

然后基本上啥也没干,仔细的看了一个多星期,看不明白的就到园子里来找,园子里的宝贝真不少!(还压了个韵。。。)

本文的例子输出使用如下方法,便于查看

function dwn(s){

document.write(s+"<br/>");

}

以下内容有些是原创,有些来自于网络,或者可以看成是读书笔记,如果有哪里不对的,请各位不吝赐教,在下感激不尽

正文开始:

一,function

从一开始接触到js就感觉好灵活,每个人的写法都不一样,比如一个function就有N种写法

如:function showMsg(){},var showMsg=function(){},showMsg=function(){}

似乎没有什么区别,都是一样的嘛,真的是一样的吗,大家看看下面的例子

///------------------------------------------------------------------------------------------------

//函数定义:命名函数(声明式),匿名函数(引用式)

//声明式,定义代码先于函数执行代码被解析

function t1(){

dwn("t1");

}

t1();

function t1(){

dwn("new t1");

}

t1();

//引用式,在函数运行中进行动态解析

var t1=function(){

dwn("new new t1");

}

t1();

var t1=function(){

dwn("new new new t1");

}

t1();

//以上输出:new t1,new t1,new new t1,new new new t1

可能想着应该是输出t1,new t1,new newt1,new new new t1,结果却并不是这样,应该理解这句话:声明式,定义代码先于函数执行代码被解析

如果深入一步,应该说是scope链问题,实际上前面两个方法等价于window.t1,可以理解为t1是window的一个公有属性,被赋了两次值,以最后一次赋值为最终值

而后面两个方法,可以理解为是t1是个变量,第四个方法的var去掉之后的结果仍然不会改变

然而,当第四个方法改成function t1(){}这样的声明式时,结果变成了new new new t1,new new new t1,new new t1,new new t1

前面两个按照我的理解可以很好的理解为什么是这个答案,第三个也可以理解,但是最后一个输出让我比较纠结,希望有高手出现解答一下

另外匿名函数还有(function(){...})()这样的写法,最后一个括号用于参数输入

还有var t1=new function(){..}这样的声明,实际上t1已经是一个对象了

例:

var t2 = new function()

{

var temp = 100; //私有成员

this.temp = 200; //公有成员,这两个概念会在第三点以后展开说明

return temp + this.temp;

}

alert(typeof(t2)); //object

alert(t2.constructor()); //300

除此之外,还有使用系统内置函数对象来构建一个函数,例:

var t3 = new Function('var temp = 100; this.temp = 200; return temp + this.temp;'); //这个位置加不加new结果都一样,WHY

alert(typeof(t3)); //function

alert(t3()); //300

二,创建对象

首先我们理解一下面向对象编程(Object-Oriented Programming,OOP),使用OOP技术,常常要使用许多代码模块,每个模块都提供特定的功能,每个模块都是孤立的,甚至与其它模块完全独立

。这种模块化编程方法提供了非常大的多样性,大大增加了代码的重用机会。可以举例进一步说明这个问题,假定计算机上的一个高性能应用程序是一辆一流赛车。如果使用传统的编程技巧,这辆赛车就是

一个单元。如果要改进该车,就必须替换整个单元,把它送回厂商,让汽车专家升级它,或者购买一个新车。如果使用OOP技术,就只需从厂商处购买新的引擎,自己按照说明替换它,而不必用钢锯切割车体。

不过大部分的论点是,javascript并不是直接的面向对象的语言,但是通过模拟可以做到很多面向对象语言才能做到的事,如继承,多态,封装,javascript都能干(没有做不到,只是想不到)

///------------------------------------------------------------------------------------------------

//以下三种构造对象的方法

//new Object,实例化一个Object

var a=new Object();

a.x=1,a.y=2;

//对象直接量

var b={x:1,y:2};

//定义类型

function Point(x,y){ //类似于C#中的类

this.x=x;

this.y=y;

}

var p=new Point(1,2); //实例化类

第一种方法通过构造基本对象直接添加属性的方法来实现,第二种和第一种差不多,可以看成是第一种方法的快捷表示法

第三种方法中,可以以”类“为基础,创造多个类型相同的对象

三,对象属性的封装(公有和私有)

以例子来说明

function List(){

var m_elements=[]; //私有成员,在对象外无法访问,如果此处无var声明,则m_elements将变成全局变量,这样外部是可以直接访问到的,如alert(m_elements[0])

m_elements=Array.apply(m_elements,arguments);

//此处模拟getter,使用时alist.length;

//等价于getName()方式:this.length=function(){return m_elements.length;},使用时alist.length();

//公有属性,可以通过"."运算符或下标来访问

this.length={

valueOf:function(){

return m_elements.length;

},

toString:function(){

return m_elements.length;

}

}

//公有方法,此方法使用得alert(alist)相当于alert(alist.toString())

this.toString=function(){

return m_elements.toString();

}

//公有方法

this.add=function(){

m_elements.push.apply(m_elements,arguments);

}

//私有方法如下形式,这里涉及到了闭包的概念,接下来继续说明

//var add=function()或function add()

//{

//m_elements.push.apply(m_elements,arguments);

/

更多信息请查看IT技术专栏

更多信息请查看网页制作
手机网站地址:javascript没那么简单
由于各方面情况的不断调整与变化, 提供的所有考试信息和咨询回复仅供参考,敬请考生以权威部门公布的正式信息和咨询为准!

2025国考·省考课程试听报名

  • 报班类型
  • 姓名
  • 手机号
  • 验证码
关于我们 | 联系我们 | 人才招聘 | 网站声明 | 网站帮助 | 非正式的简要咨询 | 简要咨询须知 | 加入群交流 | 手机站点 | 投诉建议
工业和信息化部备案号:滇ICP备2023014141号-1 云南省教育厅备案号:云教ICP备0901021 滇公网安备53010202001879号 人力资源服务许可证:(云)人服证字(2023)第0102001523号
云南网警备案专用图标
联系电话:0871-65317125(9:00—18:00) 获取招聘考试信息及咨询关注公众号:
咨询QQ:526150442(9:00—18:00)版权所有:
云南网警报警专用图标
Baidu
map