javascript弊端,javascript有用吗

什么是非侵入式JavaSpcript

简单来说就是自己编写的javascript不能局限于某一具体浏览器以及不能局限于一些内联的事件处理（如：click、mousedown）等。使用成熟的js框架就能避免自己写的js不通用的弊端，比如：JQuery、AngularJS等

非入侵式JavaScript ，大体是针对以下几个观点：

1．有些人会使用一些运行方式非常奇怪的浏览器。比如视觉受损的人会使用屏幕阅读器，一些手机用户无法使用含有JavaScript 的站点。

2．JavaScript 在不同的平台上运行方式不同。IE 是造成这一问题的罪魁祸首。我们需要根据不同的浏览器编写不同的事件处理代码。

3．这些事件处理器都会引用全局命名空间中的函数。如果你想把其他类库集成进来，而这些类库又带有相同的函数名称，那么你就会头疼了。

相关问答

Q1: 为什么很多人不喜欢javascript这个语言，这个语言玩的六也是很过瘾的，什么委托反射统统不用考虑？

喜欢的人自然喜欢，不喜欢的人主要是对css和事件讨厌。

js这种不严格的语言也可以用严格的语法，相对比较轻松上手，写其他语言的人也可以轻松入门。

但是js在深层次当中，会涉及css,html和事件、原型链等，所以有些人遇到这些的时候会不喜欢。

Q2: js中要声明变量吗？

你好，js语言是弱类型语言，无需申明即可直接使用，默认是作为全局变量使用的。

建议：

在function里时应使用var 申明变量，这样改变量仅仅只在function的生存周期内存在，不会污染到,全局控件。至于直接在script标签内使用的话则申明不声明效果都是一样的。

下面的文章可以帮助你更清楚的了解js变量

一、变量的类型

Javascript和Java、C这些语言不同，它是一种无类型、弱检测的语言。它对变量的定义并不需要声明变量类型，我们只要通过赋值的形式，可以将各种类型的数据赋值给同一个变量。例如：

i=100;//Number类型

i="variable";//String类型

i={x:4};//Object类型

i=[1,2,3];//Array类型

JS的这种特性虽然让我们的编码更加灵活，但也带来了一个弊端，不利于Debug，编译器的弱检测让我们维护冗长的代码时相当痛苦。

二、变量的声明

JS中变量申明分显式申明和隐式申明。

var i=100;//显式申明

i=100;//隐式申明

在函数中使用var关键字进行显式申明的变量是做为局部变量，而没有用var关键字，使用直接赋值方式声明的是全局变量。

当我们使用访问一个没有声明的变量时，JS会报错。而当我们给一个没有声明的变量赋值时，JS不会报错，相反它会认为我们是要隐式申明一个全局变量，这一点一定要注意。

三、全局变量和局部变量

当JS解析器执行时，首先就会在执行环境里构建一个全局对象，我们定义的全局属性就是做为该对象的属性读取，在顶层代码中我们使用this关键字和window对象都可以访问到它。而函数体中的局部变量只在函数执行时生成的调用对象中存在，函数执行完毕时局部变量即刻销毁。因此在程序设计中我们需要考虑如何合理声明变量，这样既减小了不必要的内存开销，同时能很大程度地避免变量重复定义而覆盖先前定义的变量所造成的Debug麻烦。

四、变量作用域

任何程序语言中变量的作用域都是一个很关键的细节。JS中变量的作用域相对与JAVA、C这类语言显得更自由，一个很大的特征就是JS变量没有块级作用域，函数中的变量在整个函数都中有效，运行下面代码：

SCRIPT LANGUAGE="JavaScript" type="text/javascript"

//定义一个输出函数

function outPut(s){

document.writeln(s)

}

//全局变量

var i=0;

//定义外部函数

function outer(){

//访问全局变量

outPut(i); // 0

//定义一个类部函数

function inner(){

//定义局部变量

var i = 1;

// i=1; 如果用隐式申明　那么就覆盖了全局变量i

outPut(i); //1

}

inner();

outPut(i); //0

}

outer();

/SCRIPT

输出结果为0 1 0，从上面就可以证明JS如果用var在函数体中声明变量，那么此变量在且只在该函数体内有效，函数运行结束时，本地变量即可销毁了。

由于上面的这个JS特性，还有一个关键的问题需要注意。此前一直使用ActionScript，虽然它和JS都是基于ECMA标准的，但在这里还是略有不同的。例如下面代码：

SCRIPT LANGUAGE="JavaScript" type="text/javascript"

//定义一个输出函数

function outPut(s){

document.writeln(s)

}

//全局变量

var i=0;

//定义外部函数

function outer(){

//访问全局变量

outPut(i); // 0

//定义一个类部函数

function inner(){

outPut(i); //undefiend

var i=1;

outPut(i); //1

}

inner();

outPut(i); //0

}

outer();

/SCRIPT

你可能认为输出结果是0 0 1 0，事实上在AS中确实是这样的，而在JS中的输入却是0 undefined 1 0，为何会这样了？刚才我们说到了JS函数体中声明的本地变量在整个函数中都有效，因此在上面代码中var　i = 1 ;在inner函数中都有效，实际上显式声明的变量i是在预编译时就已经编译到调用对象中了，不同于隐式声明变量在解释时才被定义为全局变量，只是在调用outPut(i)时，还没有将它初始化变量，此时的本地变量i是未赋值变量，而不是未定义变量，因此输出了undefined。上面的代码等效于下面代码：

function inner(){

var i; //定义但不赋值

outPut(i); //undefiend

i=1;

outPut(i); //1

}

为了避免上面的这类问题，因此在函数开始位置集中做函数声明是一个极力推荐的做法。

五、基本类型和引用类型

JS不同于JAVA、C这些语言，在变量申明时并不需要声明变量的存储空间。变量中所存储的数据可以分为两类：基本类型和引用类型。其中数值、布尔值、null和undefined属于基本类型，对象、数组和函数属于引用类型。

基本类型在内存中具有固定的内存大小。例如：数值型在内存中占有八个字节，布尔值只占有一个字节。对于引用型数据，他们可以具有任意长度，因此他们的内存大小是不定的，因此变量中存储的实际上是对此数据的引用，通常是内存地址或者指针，通过它们我们可以找到这个数据。

引用类型和基本类型在使用行为上也有不同之处：

SCRIPT LANGUAGE="JavaScript" type="text/javascript"

//定义一个输出函数

function outPut(s){

document.writeln(s)

}

var a = 3;

var b = a;

outPut(b);

//3

a = 4;

outPut(a);

//4

outPut(b);

//3

/SCRIPT

对基本类型b进行赋值时，实际上是又开辟了一块内存空间，因此改变变量a的值对变量b没有任何影响。

SCRIPT LANGUAGE="JavaScript" type="text/javascript"

//定义一个输出函数

function outPut(s){

document.writeln(s)

}

var a_array = [1,2,3];

var b_array = a_array;

outPut(b_array); //1,2,3

a_array[3] = 4;

outPut(b_array);//1,2,3,4

/SCRIPT

上面是对引用类型的变量赋值，实际上他们传递的是对内存地址的引用，因此对a_array和b_array的存取，实际上都是操作的同一块内存区域。如果希望重新分配内存空间存储引用型变量，那么我就需要使用克隆方法或者自定义方法来复制引用变量的数据。

Q3: 在阻止a标签的默认操作时，使用javascript:void(0);与return false在开发中有什么弊端？使用哪个更合理？

你是不想让 a 跳转吧

直接使用 a href='javascript:void(0)' 可以，没有弊端。

如果你想在a标签上面做点儿什么动作，给可以a 定义个id or class.

a href='javascript:void(0)' id='laosiji' /

然后你可以使用jquery 操作这个id。

$("#laosiji").bind('click',function(){

console.log('laosiji dai wo zhuangbi dai wo fei')；

})

Q4: 如何理解Javascript中类和对象这两个概念

在说这个话题之前，我想先说几句题外话：最近偶然碰到有朋友问我“hoisting”的问题。即在js里所有变量的声明都是置顶的，而赋值则是在之后发生的。可以看看这个例子：

var a = 'global';

(function () {

alert(a);

var a = 'local';

})();

大家第一眼看到这个例子觉得输出结果是什么？‘global’？还是‘local’？其实都不是，输出的是undefined，不用迷惑，我的题外话就是为了讲这个东西的。

其实很简单，看一看JavaScript运行机制就会明白。我们可以把这种现象看做“预声明”。但是如果稍微深究一下，会明白得更透彻。

这里其实涉及到对象属性绑定机制。因为所有JavaScript函数都是一个对象。在函数里声明的变量可以看做这个对象的“类似属性”。对象属性的绑定在语言里是有分“早绑定”和“晚绑定”之分的。

【早绑定】

是指在实例化对象之前定义其属性和方法。解析程序时可以提前转换为机器代码。通常的强类型语言如C++，java等，都是早绑定机制的。而JavaScript不是强类型语言。它使用的是“晚绑定”机制。

【晚绑定】

是指在程序运行前，无需检查对象类型，只要检查对象是否支持特性和方法即可。可以在绑定前对对象执行大量操作而不受任何惩罚。

上面代码出现的“预声明”现象，我们大可用“晚绑定”机制来解释。在函数的作用域中，所有变量都是“晚绑定”的。 即声明是顶级的。所以上面的代码和下面的一致：

var a = 'global';

(function () {

var a;

alert(a);

a = 'local';

})();

在alert(a)之前只对a作了声明而没有赋值。所以结果可想而知。

!-- 题外话到此结束 --

RT:本文要说的是，在JavaScript里，我所知道的几种定义类和对象的方式：! -- 声明：以下内容大部分来自《JavaScript高级程序设计》，只是个人叙述方式不同而已 --

【直接量方式】

使用直接量构建对象是最基础的方式，但也有很多弊端。

var Obj = new Object;

Obj.name = 'sun';

Obj.showName = function() {

alert('this.name');

}

我们构建了一个对象Obj，它有一个属性name，一个方法showName。但是如果我们要再构建一个类似的对象呢？难道还要再重复一遍？

NO！，我们可以用一个返回特定类型对象的工厂函数来实现。就像工厂一样，流水线的输出我们要的特定类型结果。

【工厂方式】

function createObj(name) {

var tempObj = new Object;

tempObj.name = name;

tempObj.showName = function () {

alert(this.name);

};

return tempObj;

}

var obj1 = createObj('obj_one');

var obj2 = createObj('obj_two');

这种工厂函数很多人是不把他当做构建对象的一种形式的。一部分原因是语义：即它并不像使用了运算符new来构建的那么正规。还有一个更大的原因，是因为这个工厂每次产出一个对象都会创建一个新函数showName(),即每个对象拥有不同的版本，但实际上他们共享的是同一个函数。

有些人把showName在工厂函数外定义，然后通过属性指向该方法，可以避开这个问题：

代码

可惜的是，这种方式让showName()这个函数看起来不像对象的一个方法。

【构造函数方式】

这种方式是为了解决上面工厂函数的第一个问题，即没有new运算符的问题。可是第二个问题它依然不能解决。我们来看看。

function Obj(name) {

this.name = name;

this.showName = function () {

alert(this.name);

}

}

var obj1 = new Obj('obj_one');

var obj2 = new Obj('obj_two');

它的好处是不用在构造函数内新建一个对象了，因为new运算符执行的时候会自动创建一个对象，并且只有通过this才能访问这个对象。所以我们可以直接通过this来对这个对象进行赋值。而且不用再return，因为this指向默认为构造函数的返回值。

同时，用了new关键字来创建我们想要的对象是不是感觉更“正式”了。

可惜，它仍然不能解决会重复生成方法函数的问题，这个情况和工厂函数一样。

【原型方式】

这种方式对比以上方式，有个很大的优势，就是它解决了方法函数会被生成多次的问题。它利用了对象的prototype属性。我们依赖原型可以重写对象实例。

var Obj = function () {}

Obj.prototype.name = 'me';

Obj.prototype.showName = function () {

alert(this.name);

}

var obj1 = new Obj();

var obj2 = new Obj();

我们依赖原型对构造函数进行重写，无论是属性还是方法都是通过原型引用的方式给新建的对象，因此都只会被创建一次。可惜的是，这种方式存在两个致命的问题：

1。没办法在构建对象的时候就写入想要的属性，因为原型在构造函数作用域外边，没办法通过传递参数的方式在对象创建的时候就写入属性值。只能在对象创建完毕后对值进行重写。

2。致命问题在于当属性指向对象时，这个对象会被多个实例所共享。考虑下面的代码：

var Obj = function () {}

Obj.prototype.name = 'me';

Obj.prototype.flag = new Array('A', 'B');

Obj.prototype.showName = function () {

alert(this.name);

}

var obj1 = new Obj();

var obj2 = new Obj();

obj1.flag.push('C');

alert(obj1.flag); // A,B,C

alert(obj2.flag); //A,B,C

是的，当flag属性指向对象时，那么实例obj1和obj2都共享它，哪怕我们仅仅改变了obj1的flag属性，但是它的改变在实例obj2中任然可见。

面对这个问题，让我们不得不想是否应该把【构造函数方式】和【原型方式】结合起来，让他们互补。。。

【构造函数和原型混合方式】

我们让属性用构造函数方式创建，方法用原型方式创建即可：

var Obj = function (name) {

this.name = name;

this.flag = new Array('A', 'B');

}

Obj.prototype = {

showName : function () {

alert(this.name);

}

}

var obj1 = new Obj();

var obj2 = new Obj();

obj1.flag.push('C');

alert(obj1.flag); // A,B,C

alert(obj2.flag); //A,B

这种方式有效地结合了原型和构造函数的优势，是目前用的最多，也是副作用最少的方式。

不过，有些追求完美的家伙还不满足，因为在视觉上还没达到他们的要求，因为通过原型来创建方法的过程在视觉上还是会让人觉得它不太像实例的方法（尤其对于传统OOP语言的开发者来说。）

所以，我们可以让原型活动起来，让他也加入到构造函数里面去，好让这个构造函数在视觉上更为统一。而这一系列的过程只需用一个判断即可完成。

var Obj = function (name) {

this.name = name;

this.flag = new Array('A', 'B');

if (typeof Obj._init == 'undefined') {

Obj.prototype = {

showName : function () {

alert(this.name);

}

};

Obj._init = true;

}

}

如上，用_init作为一个标志来判断是否已经给原型创建了方法。如果是那么就不再执行。这样其实在本质上是没有任何变化的，方法仍是通过原型创建，唯一的区别在于这个构造函数看起来“江山统一”了。

但是这种动态原型的方式是有问题的，《JavaScript高级程序设计》里并没有深究。创建第一个对象的时候会因为prototype在对象实例化之前没来的及建起来，是根本无法访问的。所以第一个对象是无法访问原型方法的。同时这种方式在子类继承中也会有问题。

关于解决方案，我会在下一文中说明。

其实就使用方便来说的话，个人觉得是没必要做这个判断的。。。呵呵 ^_^