JavaScript基础 - 语言特性

简介: JavaScript是基于函数的语言,一切都是对象,但又比较特殊 引用 引用是指向实际对象的一个指针和C/C++的指针一样,C#和java的对象也是引用传递   函数重载 // A simple function for sending a message functio...

JavaScript是基于函数的语言,一切都是对象,但又比较特殊

引用

引用是指向实际对象的一个指针和C/C++的指针一样,C#和java的对象也是引用传递

 

函数重载

// A simple function for sending a message

function sendMessage( msg, obj ) {

    // If both a message and an object are provided

    if ( arguments.length == 2 )

        // Send the message to the object

        obj.alert( msg );

 

    // Otherwise, assume that only a message was provided

    else

        // So just display the default error message

        alert( msg );

}

 

// Both of these function calls work

sendMessage( "Hello, World!" );

sendMessage( "How are you?", window );

作用域

作用域是由函数划分的,而不是块(Block)划分,和其他的语言不一样的地方

// Set a global variable, foo, equal to test

var foo = "test";

 

// Within an if block

if ( true ) {

    // Set foo equal to 'new test'

    // NOTE: This is still within the global scope!

    var foo = "new test";

}

 

// As we can see here, as foo is now equal to 'new test'

alert( foo == "new test" );

 

// Create a function that will modify the variable foo

function test() {

    var foo = "old test";

}

 

// However, when called, 'foo' remains within the scope

// of the function

test();

 

// Which is confirmed, as foo is still equal to 'new test'

alert( foo == "new test" );

 

JavaScript全局作用域就是window对象

// A globally-scope variable, containing the string 'test'

var test = "test";

 

// You'll notice that our 'global' variable and the the

// property of the the window object are identical

alert( window.test == test );

 

// A function in which the value of foo is set

function test() {

    foo = "test";

}

 

// Call the function to set the value of foo

test();

 

// We see that foo is now globally scoped

alert( window.foo == "test" );

闭包

闭包意味着内层的函数可以引用存在于包含它的函数内的变量,即使外层函数的执行已经终止

详细参考:http://jibbering.com/faq/faq_notes/closures.html

不用产生全局函数:

// Create a new anonymous function, to use as a wrapper

(function(){

    // The variable that would, normally, be global

    var msg = "Thanks for visiting!";

 

    // Binding a new function to a global object

    window.onunload = function(){

        // Which uses the 'hidden' variable

        alert( msg );

    };

 

// Close off the anonymous function and execute it

}());

上下文

this 这个功能在JavaScript中充分发挥

 

var obj = {

    yes: function(){

        // this == obj

        this.val = true;

    },

    no: function(){

        this.val = false;

    }

};

 

// We see that there is no val property in the 'obj' object

alert( obj.val == null );

 

// We run the yes function and it changes the val property

// associated with the 'obj' object

obj.yes();

alert( obj.val == true );

 

// However, we now point window.no to the obj.no method and run it

window.no = obj.no;

window.no();

 

// This results in the obj object staying the same (as the context was

// switched to the window object)

alert( obj.val == true );

// and window val property getting updated.

alert( window.val == false );

 

以上处理有些不太同一理解,JavaScript提供了call和apply方法实现这个功能:

// A simple that sets the color style of its context

function changeColor( color ) {

    this.style.color = color;

}

// Calling it on the window object, which fails, since it doesn't

// have a style object

changeColor( "white" );

 

// Find the element with an ID of main

var main = document.getElementById("main");

// Set its color to black, using the call method

// The call method sets the context with the first argument

// and passes all the other arguments as arguments to the function

changeColor.call( main, "black" );

 

// A function that sets the color on  the body element

function setBodyColor() {

    // The apply method sets the context to the body element

    // with the first argument, the second argument is an array

    // of arguments that gets passed to the function

    changeColor.apply( document.body, arguments );

}

// Set the background color of the body to black

setBodyColor( "black" );

相关文章
|
2月前
|
前端开发 JavaScript 开发者
JavaScript:无处不在的Web语言
JavaScript:无处不在的Web语言
|
8月前
|
JSON 自然语言处理 前端开发
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
453 72
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
|
自然语言处理 JavaScript 前端开发
ECMAScript 6 的出现为 JavaScript 带来了许多新的特性和改进
这些只是ES6的一些主要特性,它们极大地增强了JavaScript的功能和表现力,使得JavaScript在大型应用开发、前端框架等领域能够更加高效地编写复杂的应用程序。
|
10月前
|
JavaScript 前端开发 容器
盘点JavaScript中所有声明变量的方式及特性
本文详细介绍了JavaScript中变量定义的多种方式,包括传统的`var`、`let`和`const`,以及通过`this`、`window`、`top`等对象定义变量的方法。每种方式都有其独特的语法和特性,并附有代码示例说明。推荐使用`let`和`const`以避免作用域和提升问题,谨慎使用`window`和`top`定义全局变量,不建议使用隐式全局变量。掌握这些定义方式有助于编写更健壮的JS代码。
238 11
|
12月前
|
JavaScript 前端开发 安全
JavaScript与TypeScript的对比,分析了两者的特性及在实际项目中的应用选择
本文深入探讨了JavaScript与TypeScript的对比,分析了两者的特性及在实际项目中的应用选择。JavaScript以其灵活性和广泛的生态支持著称,而TypeScript通过引入静态类型系统,提高了代码的可靠性和可维护性,特别适合大型项目。文章还讨论了结合使用两种语言的优势,以及如何根据项目需求和技术背景做出最佳选择。
1367 4
|
JavaScript 前端开发 安全
ECMAScript 6(以下简称 ES6)的出现为 JavaScript 带来了许多新的特性和改进,其中 let 和 const 是两个非常重要的关键字。
ES6 引入了 `let` 和 `const` 关键字,为 JavaScript 的变量管理带来了革新。`let` 提供了块级作用域和暂存死区特性,避免变量污染,增强代码可读性和安全性;`const` 用于声明不可重新赋值的常量,但允许对象和数组的内部修改。两者在循环、函数内部及复杂项目中广泛应用,有助于实现不可变数据结构,提升代码质量。
180 5
|
JSON 前端开发 JavaScript
聊聊 Go 语言中的 JSON 序列化与 js 前端交互类型失真问题
在Web开发中,后端与前端的数据交换常使用JSON格式,但JavaScript的数字类型仅能安全处理-2^53到2^53间的整数,超出此范围会导致精度丢失。本文通过Go语言的`encoding/json`包,介绍如何通过将大整数以字符串形式序列化和反序列化,有效解决这一问题,确保前后端数据交换的准确性。
326 4
|
JavaScript 前端开发 索引
JavaScript ES6及后续版本:新增的常用特性与亮点解析
JavaScript ES6及后续版本:新增的常用特性与亮点解析
452 4
|
JavaScript 前端开发 编译器
掌握现代化JavaScript:ECMAScript提案与特性
【10月更文挑战第13天】本文介绍了ECMAScript(ES)的最新提案与特性,包括可选链、空值合并运算符、类字段和顶层Await等。通过跟踪TC39提案、使用Babel或TypeScript、测试兼容性以及逐步迁移,开发者可以高效地采用这些新特性,简化代码、提高开发效率并增强应用功能。文章还提供了实战技巧,帮助开发者在现代Web开发中充分利用这些现代化的特性。