WEB前端

 

第二篇：web前端

var flag=true;

var flag2=true;

if(flag==true)

{ var i=0;

j=1;

if(flag2==true) {

for( var m=0;m<10;m++) {} }

}

alert(i);

alert(j);

alert(m);

// 输出 0, 1, 10

var x = 1;

function ScopeTest(){

alert( x );

}

ScopeTest(); // 输出 1

var x = 1;

function ScopeTest(){

alert( x );

var x = 'hello world';

alert( x );

}

ScopeTest();

// 输出 underfined, hello world

var name = 'laruence';

function echo()

{

alert(name);

}

function env()

{

var name = 'eve'; echo();

}

env();

// 输出 laruence

function test(xxx){

alert(xxx);

var xxx = 123;

function xxx(){

}

alert(xxx);

}

test(444);

// 输出 function xxx(){}，123

代码

function JSClass() {

this.m_Text = 'division element';

this.m_Element = document.createElement('DIV');

this.m_Element.innerHTML = this.m_Text;

this.m_Element.attachEvent('onclick', this.ToString);

}

JSClass.prototype.Render = function() {

document.body.appendChild(this.m_Element);

}

JSClass.prototype.ToString = function() {

alert(this.m_Text);

};

var jc = new JSClass();

jc.Render();//添加渲染div元素 jc.ToString(); //输出 division element //click添加的div元素division element会输出underfined，为什么？

//click添加的div元素division element会输出underfined，为什么？

//这时的EventHandler()方法中的this关键字，指示的对象是IE的window对象。 //这是因为EventHandler只是一个普通的函数，对于attachEvent后，

//脚本引擎对它的调用和div对象本身没有任何的关系。同时你可以再看看EventHandler的caller属性，

//它是等于null的。如果我们要在这个方法中获得div对象引用，应该使用：this.event.srcElement。

代码

var obj = {

i: "test",

m: function() {

alert(this.i); //指向obj对象 实例,输出值test function B() {

alert(this.i); //输出值undefined //调用B的实例是m，不是obj，所以this就是m //m里面没有i，所以默认会加上一句var i；当然是underfined。 }

B();

}

}

obj.m();

代码

<a id="alink" href="#" onclick="getEleType">Some text</a> <script type="text/javascript"> function getEleType() {

alert(this.tagName); //结果： undefined，其实getEleType.caller是null，this关键字指示的对象是IE的window对象

}

//正确的写法1：onclick="getEleType(this)" function getEleType(m) {alert(m.tagName); //正确的写法2：

document.getElementById("alink").onclick=getEleType;//this关键字指示的对象是caller实例 </script>

代码

1. var obj = {

2. i : "test",

3. m : function(){

4. alert(this.i);//指向obj对象 ,值test 5. function B(){

6. var i = 1;

7. alert(this.i);//指向window对象,值undefined 8. }

9. B();//B并不是window的方法，this为什么也指向window？？？？？？

10. }

11. }

12. obj.m();

//this指向的是当前函数的作用域,而不是函数的调用者

//函数的作用域在其定义时已经确定,但可以动态改变.

//行内嵌js作用域会出现比较特别诡异的情况,不推荐这种写法.

主要考察JS知识点：

JavaScript是解释性动态语言，不是编译性静态语言

在JS中”一切皆是对象, 函数也是”

JavaScript中的函数运行在它们被定义的作用域里,而不是它们被执行的作用域里 JavaScript没有块级作用域。

JavaScript的变量作用域是基于其特有的作用域链的

函数中声明的变量在整个函数中都有定义

函数体内部，局部变量的优先级比同名的全局变量高。

未使用var关键字定义的变量都是全局变量。

全局变量都是window对象的属性

JavaScript中的函数运行在它们被定义的作用域里,而不是它们被执行的作用域里

( 在JS中, 有预编译/预解释的过程,JS的预编译是以段为处理单元的，JS在执行每一段JS代码之前, 都会首先处理var关键字和function定义式(函数定义式和函数表达式)。在调用函数执行之前, 会首先创建一个活动对象, 然后搜寻这个函数中的局部变量定义,和函数定义, 将变量名和函数名都做为这个活动对象的同名属性, 对于局部变量定义,变量的值会在真正执行的时候才计算, 此时只是简单的赋为undefined. )