【JavaScript】JavaScript基础详解(文末送书)

这篇具有很好参考价值的文章主要介绍了【JavaScript】JavaScript基础详解(文末送书)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

【JavaScript】JavaScript基础详解(文末送书),javascript,开发语言,ecmascript


👉博__主👈:米码收割机
👉技__能👈:C++/Python语言
👉公众号👈:测试开发自动化【获取源码+商业合作】
👉荣__誉👈:阿里云博客专家博主、51CTO技术博主
👉专__注👈:专注主流机器人、人工智能等相关领域的开发、测试技术。


系列文章目录



一、变量声明

在 JavaScript 中,可以使用三种方式来声明变量:

  1. var: 这是传统的方式,但在 ES6 (ECMAScript 2015) 之后,它的使用开始逐渐被限制在函数作用域。

    var name = "ChatGPT";
    
  2. let: 从 ES6 开始引入,允许你声明块级作用域的变量。

    let age = 5;
    
  3. const: 同样从 ES6 开始引入,用于声明不可变的变量(常量)。一旦给它赋值,你就不能再更改它。

    const PI = 3.141592653589793;
    

二、数据类型

  • Number:表示数值。

    let x = 123;
    let y = 3.14;
    
  • String:表示文本。

    let greeting = "Hello, World!";
    
  • Boolean:表示真或假。

    let isTrue = true;
    let isFalse = false;
    
  • Object:用于存储键值对。

    let person = {firstName: "John", lastName: "Doe"};
    
  • Array:用于存储元素的列表。

    let fruits = ["Apple", "Banana", "Cherry"];
    
  • null:表示没有值。

    let emptyValue = null;
    
  • undefined:表示变量已声明但尚未赋值。

    let testVar;
    console.log(testVar); // 输出: undefined
    

三、控制结构

  • If 语句

    if (age > 18) {
        console.log("Adult");
    } else {
        console.log("Child");
    }
    
  • For 循环

    for (let i = 0; i < 5; i++) {
        console.log(i);
    }
    
  • 函数声明

    function greet(name) {
        console.log("Hello, " + name);
    }
    

四、函数

JavaScript 中的函数是其核心概念之一。函数允许将代码块组织在一起并在需要的地方调用它。

1. 函数声明

这是定义函数的一种方式,使用 function 关键字 followed by the function’s name:

function sayHello() {
    console.log("Hello, World!");
}

2. 函数表达式

函数也可以使用表达式来定义,并赋值给一个变量。这样的函数通常是匿名的(没有名称):

const sayGoodbye = function() {
    console.log("Goodbye, World!");
};

3. 箭头函数(ES6)

从 ES6 开始,JavaScript 引入了箭头函数,为我们提供了定义函数的另一种简洁方式:

const add = (a, b) => a + b;

4. 参数

你可以将值传递给函数,这些值称为参数。函数可以接受多个参数:

function greet(firstName, lastName) {
    console.log("Hello, " + firstName + " " + lastName);
}

5. 默认参数(ES6)

如果调用函数时缺少参数,你可以为函数参数设置默认值:

function greet(name = "World") {
    console.log("Hello, " + name);
}

6. 返回值

使用 return 语句从函数返回一个值:

function square(number) {
    return number * number;
}

7. 函数作为参数

在 JavaScript 中,函数是第一类对象,这意味着你可以将函数作为另一个函数的参数:

function calculate(x, y, operation) {
    return operation(x, y);
}

const result = calculate(5, 3, (a, b) => a + b); // 8

8. 立即调用的函数表达式(IIFE)

这是一个定义后立即执行的函数:

(function() {
    console.log("This function runs as soon as it's defined!");
})();

9. 闭包

闭包是一个函数与其相关的词法作用域捆绑在一起。这使得函数可以访问其外部函数的变量,即使外部函数已经完成了执行:

function outerFunction() {
    let outerVariable = "I'm from outer function!";
    return function() {
        console.log(outerVariable);
    };
}

const innerFunction = outerFunction();
innerFunction(); // 输出: "I'm from outer function!"

五、类

JavaScript 支持面向对象编程,并且在 ES6 (ECMAScript 2015) 之后,正式引入了 class 语法来模拟经典的面向对象语言中的类的概念。尽管之前的版本中 JavaScript 使用了基于原型的继承,但 ES6 的 class 提供了一种更直观和结构化的方式来创建对象和处理继承。

以下是使用 JavaScript class 的一些基本概念:

1. 类的声明

你可以使用 class 关键字来声明一个类:

class Person {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }

    greet() {
        console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
    }
}

const john = new Person('John', 30);
john.greet(); // 输出: Hello, my name is John and I am 30 years old.

2. 继承

使用 extends 关键字可以从另一个类继承:

class Employee extends Person {
    constructor(name, age, jobTitle) {
        super(name, age);
        this.jobTitle = jobTitle;
    }

    introduce() {
        console.log(`Hello, my name is ${this.name}, I am ${this.age} years old and I work as a ${this.jobTitle}.`);
    }
}

const jane = new Employee('Jane', 28, 'Software Developer');
jane.introduce(); // 输出: Hello, my name is Jane, I am 28 years old and I work as a Software Developer.

3. 静态方法

使用 static 关键字,你可以在类上定义静态方法,而不是它的实例:

class Utility {
    static addNumbers(a, b) {
        return a + b;
    }
}

console.log(Utility.addNumbers(2, 3)); // 输出: 5

4. getter 和 setter

你可以使用 getset 关键字为类定义访问器和设置器:

class Circle {
    constructor(radius) {
        this._radius = radius;
    }

    // getter
    get diameter() {
        return this._radius * 2;
    }

    // setter
    set diameter(value) {
        this._radius = value / 2;
    }
}

const circle = new Circle(5);
console.log(circle.diameter); // 输出: 10
circle.diameter = 14;
console.log(circle._radius); // 输出: 7

本期好书推荐《JavaScript从入门到精通(第5版)》


【书籍介绍】

JavaScript入门经典,42万Web前端程序员的入行选择。配备Web前端开发资源库,在线答疑,学习1小时,训练10小时,从入门到项目上线,打造全新学习生态。


【购买链接】

京东:https://item.jd.com/13791889.html
当当:http://product.dangdang.com/29594970.html

【JavaScript】JavaScript基础详解(文末送书),javascript,开发语言,ecmascript文章来源地址https://www.toymoban.com/news/detail-713794.html

到了这里,关于【JavaScript】JavaScript基础详解(文末送书)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 【Python基础】- for/while循环语句(文末送书)

      🤵‍♂️ 个人主页:@艾派森的个人主页 ✍🏻作者简介:Python学习者 🐋 希望大家多多支持,我们一起进步!😄 如果文章对你有帮助的话, 欢迎评论 💬点赞👍🏻 收藏 📂加关注+ 目录 Python循环语句 while循环 无限循环 while 循环使用 else 语句 for 循环 range对象 列表推导

    2024年02月08日
    浏览(57)
  • 作为开发者如何有效使用 ChatGPT(文末送书)

    🤵‍♂️ 个人主页:@艾派森的个人主页 ✍🏻作者简介:Python学习者 🐋 希望大家多多支持,我们一起进步!😄 如果文章对你有帮助的话, 欢迎评论 💬点赞👍🏻 收藏 📂加关注+ 目录 一、制作提示词         二、实际应用 2.1学习新的语言和框架 2.2准备认证考试 2.3调

    2024年02月07日
    浏览(41)
  • 【Python基础】- 自定义函数和匿名函数(文末送书3本)

      🤵‍♂️ 个人主页:@艾派森的个人主页 ✍🏻作者简介:Python学习者 🐋 希望大家多多支持,我们一起进步!😄 如果文章对你有帮助的话, 欢迎评论 💬点赞👍🏻 收藏 📂加关注+ 函数是组织好的,可重复使用的,用来实现单一,或相关联功能的代码段。   函数能提高

    2024年02月15日
    浏览(43)
  • 【Linux 服务器运维】定时任务 crontab 详解 | 文末送书

    本文思维导图概述的主要内容: 1.1 什么是 crontab Crontab 是一个在 Unix 和 Linux 操作系统上 用于定时执行任务 的工具。它允许用户创建和管理计划任务,以便在特定的时间间隔或时间点自动运行命令或脚本。Crontab 是 cron table 的缩写, cron 指的是 Unix 系统中的一个后台进程,它

    2024年02月08日
    浏览(92)
  • 【文末送书】全栈开发流程——后端连接数据源(二)

    「作者主页」 :雪碧有白泡泡 「个人网站」 :雪碧的个人网站 「推荐专栏」 : ★ java一站式服务 ★ ★ React从入门到精通 ★ ★ 前端炫酷代码分享 ★ ★ 从0到英雄,vue成神之路★ ★ uniapp-从构建到提升 ★ ★ 从0到英雄,vue成神之路 ★ ★ 解决算法,一个专栏就够了 ★ ★

    2024年02月09日
    浏览(42)
  • Kafka事务是怎么实现的?Kafka事务消息原理详解(文末送书)

    大家好,我是哪吒。 前两天,有个朋友去面试,被问到Kafka事务的问题。 她的第一反应是: 我是来面试Java的,怎么问我大数据的Kafka? 文末送5本《Spring Boot 3核心技术与最佳实践》 不过Kafka确实是Java程序员必备的中间件技术了,这点是毋庸置疑的。 Kafka几乎是当今时代背景

    2024年02月04日
    浏览(50)
  • MySQL基础篇——MySQL数据库的介绍、下载、安装【文末送书】

    作者简介:一名云计算网络运维人员、每天分享网络与运维的技术与干货。   座右铭:低头赶路,敬事如仪 个人主页:网络豆的主页​​​​​​ 目录 前言 一.数据库相关概念 1.什么是数据库  2.什么是数据库管理系统  3.SQL是什么 4. 数据库市场占有率 二.mysql安装 1. 安装

    2024年02月05日
    浏览(60)
  • 【粉丝福利社】鸿蒙App开发全流程实战(文末送书-进行中)

    🏆 作者简介,愚公搬代码 🏆《头衔》:华为云特约编辑,华为云云享专家,华为开发者专家,华为产品云测专家,CSDN博客专家,CSDN商业化专家,阿里云专家博主,阿里云签约作者,腾讯云优秀博主,腾讯云内容共创官,掘金优秀博主,51CTO博客专家等。 🏆《近期荣誉》:

    2024年03月14日
    浏览(53)
  • 【Linux实践室】Linux文件打包和解压缩实战指南:tar打包命令操作详解(文末送书)

    🌈个人主页: 聆风吟_ 🔥系列专栏: Linux实践室、网络奇遇记 🔖少年有梦不应止于心动,更要付诸行动。 有时,我们会在Linux系统中将多个文件打包成一个单独的文件,通过本节的学习,我们将学会如何在Linux系统中将多个文件/目录打包生成一个文件。 本节任务:使用

    2024年04月29日
    浏览(49)
  • Django新手必看:从入门到精通Web应用开发①【文末送书三本】

    🏘️🏘️个人简介:以山河作礼。 🎖️🎖️: Python领域新星创作者,CSDN实力新星认证,阿里云社区专家博主 🎁🎁:Web全栈开发专栏:《Web全栈开发》免费专栏,欢迎阅读! 🎁🎁: 文章末尾扫描二维码可以加入粉丝交流群,不定期免费送书。 Django 是使用 Python 语言开发的

    2024年02月08日
    浏览(51)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包