JavaScript学习笔记 1】初识JS

限时加码!20+主流AI编程工具免费用 购周边加赠Coding Plan Lite,Claude Code、Cursor等即刻畅享,学习进阶更高效! 阅读详情

目录

一、JS是什么?

二、JS的作用?

三、JS的组成

 四、JS的书写位置

1. 内部JS

2. 外部JS(外部导入)

3. 内联JS

4. 练习

五、JS的注释与结束符

1. 注释

2. 结束符

3. JS该不该加分号?

六、JS的输入和输出语法

1. 输出语法

a. 输出在页面中

b. 弹出警告对话框

c. 输出在控制台中

2. 输入语法

a. 显示一个对话框输入

3. 练习

七、JS代码的执行顺序

八、字面量

九、 总结


一、JS是什么?

JS(JavaScript)是一种运行在客户端(浏览器)的编程语言,实现人机交互效果。HTML和CSS是标记语言而不是编程语言。

二、JS的作用?

  • 网页特效(监听用户的一些行为让网页作出对应的反馈)
  • 表单验证(针对表单数据的合法性进行判断)【JS表单验证是优化项目性能的好方法】
  • 数据交互(获取后台的数据,渲染到前端)
  • 使用Node.js做后端开发

三、JS的组成

  • 如果是分为两部分就分为:ECMAScript、Web APIs
  • 如果是分为三部分就把Web APIs再拆分一下,拆为DOM和BOM,三部分为ECMAScript、DOM、BOM。

JavaScript | MDN

 四、JS的书写位置

1. 内部JS

内部JS就是将<script>标签写在<body>最下面,也就是放在</body>上,

2. 外部JS(外部导入)

  • 位置不变,仍在<body>的最下面,但是要通过<script src="xxx">来导入
  • 注意使用这种写法<script>标签的中间就不要写内容了,写了也不执行。

3. 内联JS

也就是在标签内部写JS代码。

4. 练习

<body>
    <--内部JS-->
    <script>
        alert("aaaaa");
    </script>

    <--外部JS-->
    <script src="./JSdemo1.js"></script>
</body>

五、JS的注释与结束符

1. 注释

JS的注释和其他编程语言一样,//是单行注释,/**/是多行注释。

2.结束符

; 为结束符,但是可写可不写。

3. JS该不该加分号?

  • 按你所在的开发团队的规定来。
  • 不要一味的认为“语句的结尾当然应该加分号”,这是一个保守的、未经深入思考的草率结论。

六、JS的输入和输出语法

1. 输出语法

a. 输出在页面中

  • document.write('要输出的内容')
  • 单引号,双引号都行,但一定要把要输出的内容括起来。
  • 如果输出的内容是标签,也会被解析成网页元素。

<body>
    <script>
        document.write("demo2");
        document.write("<h1> demo2 </h1>");
    </script>
</body>

b. 弹出警告对话框

  • alter("要输出的内容")
  • 单引号和双引号都行,但一定要把要输出的内容括起来。
  • 不会解析标签。
<body>
    <script>
        alert("demo2")
        alert('demo')
    </script>
</body>

c. 输出在控制台中

  • console.log("控制台打印")
  • 开发时,打印日志给我们开发人员看的。
<body>
    <script>
        console.log("demo2")
        console.log('demo2')
    </script>
</body>

2. 输入语法

a. 显示一个对话框输入

  • prompt("xxxx")
  • 后面使用变量可以获取到用户输入的信息。

3. 练习

<body>
    <script>
        alert('你好JS')
        document.write('JavaScript我来了!')
        console.log('它~会魔法吧~')
    </script>
</body>

七、JS代码的执行顺序

  • 按照从上往下的顺序执行JS代码
  • alert()和prompt()弹出框会被优先执行

八、字面量

  • 数字字面量   ---  100
  • 字符串字面量   --- 'abc' \ "abc"
  • 数组字面量   ---  []
  • 对象字面量   ---  {}

九、 总结


 ------------------------END-------------------------

才疏学浅,谬误难免,欢迎各位批评指正。

JavaScript的起源?不同的JavaScript和引擎?JS版本发展史? 1995年,JavaScript诞生了。不得不提到它的标准ECMAScript, 它是一个语言标准,而非具体的语言JavaScript除了名字有”Java”, 其它和Java没任何关系。Netscape为推广自家的LiveScript,命名中包含当时最流行的编程语言Java来蹭蹭热度。Netscape公司有些人可能不熟悉, 它就是早期被IE做浏览器对抗后来逐渐消亡一家公司。 阅读详情

相关推荐

JavaScript_JS的历史与发展

JS的诞生:程序员的弃子 以下引用部分来源于: Javascript诞生记 - 阮一峰的网络日志 (ruanyifeng.com) JS的发明者是布兰登·艾奇(Brendan Eich)。他出生于1961年,本科一开始是念物理学的,后来转去了数学和计算机系。有趣的是,作为JS之父,他却并不喜欢自己的这个孩子。 90年代初的早期浏览器功能非常弱小,而且受众范围也不广。那时,浏览器最大的功能是展示一些图片和文字: 彼时,浏览器的王者是一个叫网景(Netscape)的公司开发的网景浏览器(Netscape N

Happievening的博客 2085

JS学习笔记1.JavaScript初识

Web前端三层 结构层 HTML:从语义的角度,描述页面的结构。 样式层CSS:从审美的角度,美化页面或称为描述样式。 行为层JavaScript:从交互的角度,提升用户的体验或称为描述行为。 JavaScript相关历史 Netscape在最初将其脚本语言命名为LiveScript,后来Netscape在与Sun合作之后将其改名为JavaScriptJavaScript最初受Java启发...

jacksonCya,Hello My World 354

深入掌握JavaScript Node.js开发

本文还有配套的精品资源,点击获取 简介:JavaScript是前端开发中的主导语言,在Node.js环境下的服务器端编程中也显示出重要性。Node.js是一个基于V8引擎的跨平台JavaScript运行环境,具有事件驱动和非阻塞I/O特性,适用于构建高性能的并发服务器。该压缩包文件可能包含有关Node.js核心概念和模块的资料,比如模块化设计、文件系统操作、HTTP服务器创...

weixin_28809949的博客 1699

前端学习笔记三:JavaScript1初识js(前提知识储备+警告框+变量与常量+访问HTML元素+显示js值+调用外部js文件+声明创建对象+在js里获取HTML对象并在其内容里插入值)

前提知识就不提了,js是一种编程语言,计算机系的大学生总该有点底子。 另外,到了js部分就用注释来讲解知识点~~(别问为什么之前不采用,问就是懒)~~ 直接上代码: 第一段: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <tit

Reiuji_Utsuho的博客 473

Vue.js 学习笔记1初识Vue.js

本篇目录: 1.1 Vue.js 是什么 1.2 如何使用Vue.js 本章主要介绍与Vue.js有关的一些概念与技术,并帮助你了解它们背后相关的工作原理。 通过对本章的学习,即使从未接触过Vue.js,你也可以运用这些知识点快速构建出一个Vue.js应用。 1.1 Vue.js 是什么 Vue.js的官方文档中是这样介绍它的: 简单小巧的、渐进式JavaSc...

weixin_30877227的博客 551

javascript学习笔记1初识

前言 最近在学习javascript,既然学习就要有收获,准备发布到博客上,一是巩固学习内容,二来分享给大家如果有写的欠妥的地方希望大家斧正。 言归正传,我们开始吧。 下面展示一个小例子: 使用到的工具: 1,notepad++编辑器 (或者是你喜欢的编辑器只要是可以编辑普通文件即可) 2,浏览器(我自己使用chrome浏览器) 使用notepad++将以下内容复制过去并保存

小猪猪工作室博客 529

node.js 初识node.js,运行在服务端的 JavaScript(一)

文章目录1.浏览器原理2.浏览器访问服务器过程3.web开发本质4.什么是node.js?5.node.js有哪些特点?6.安装Node.js 1.浏览器原理 2.浏览器访问服务器过程 https://edu.aliyun.com/lesson_1730_14083?spm=5176.10731542.0.0.4fb815f2VGm9PU#_14083 请求报文和相应报文。 3.web开发本质 一般web都是下面三点一样: 1.请求,客户端发起请求。 2.处理,服务器处理请求。 3.响应,服务器将处理结果

探索技术与实践的旅程,分享编程经验与工具使用心得,助力开发者提升技能。 1万+

初识JavaScript——JS

目录 1.认识JS 1.1JavaScript是什么 1.2JS的作用 1.3 HTML/CSS/JS的关系 1.4 浏览器执行JS 1.5JS的组成 1.6JS书写位置 1.7JS注释 1.8JS输入输出语句 2.变量 2.1变量的理解和储存 2.2变量的使用 2.3变量语法拓展 2.4声明变量的特殊情况 2.5变量的命名规范 1.认识JS 1.1JavaScript是什么 1.JS是一种 运行在客户端的脚本语言。 2.脚本语言不需要编译,在运行过程中有J.

孙宇航的博客 2595

深入JavaScriptJS引擎如何执行JS代码

我们大概经常能听到“执行环境”、“作用域”、“原型(链)”、“执行上下文”等内容,它们都在描述什么? JS代码的运行 我们知道了js是弱类型语言,在运行时才确定变量类型。js引擎在执行js代码时,也会从上到下进行 词法分析、语法分析、语义分析 等处理,并在代码解析完成后生成AST(抽象语法树),最终根据AST生成CPU可以执行的机器码并执行。 除此之外,JS引擎在执行代码时还会进行其它处理,如 V8 中还有两个阶段: 编译阶段:该阶段会进行执行上下文的创建,包括创建变量对象、建立作用域链、确定 this

flying meng的菜鸟居 5415

初识JavaScript

这次写一篇对于JavaScript的简介,我们知道的编程语言有很多种,比如Java、C++、Python等等,每种语言都有他独特的地方,每种编程语言都具有共同的初心,直白点说就是人与计算机进行沟通的语言。如果本文对你有所帮助请三连支持博主,你的支持是我更新的动力。以下是本篇文章正文内容浏览器分成两部分渲染引擎和JS引擎渲染引擎用来解析HTML与CSS,俗称内核,比如chrome浏览器的blink老版本的webkitJS引擎也称为JS解释器。...

程序员柒的博客 816

1.1初识JavaScript ——JS

JS 简介,变量,编码规范

m0_58761900的博客 1075

【Anime.js】——JavaScript动画库:Anime.js——学习笔记

官网定义:anime.js 是一个简便的JS动画库,用法简单而且适用范围广,涵盖CSS,DOM,SVG还有JS的对象,各种带数值属性的东西都可以动起来。

qq_50497708的博客 1万+

JavaScript学习笔记

JavaScript学习笔记

x18395499277的博客 1969

Js基础_初识JavaScript

文章目录一、JavaScript是什么?二、Js作用三、浏览器执行Js 一、JavaScript是什么? 是一种运行在客户端的脚本语言(不需要编译,运行过程中由解释器逐行来进行解释执行) Node.js可以进行服务端编程 二、Js作用 1.表单动态校验(密码强度检测) 2.网页特效 3.服务端开发(Node.js) 4.左面程序(Electron) 5.App/小程序(Cordova) 6.控制硬件-物联网(Ruff) 7.游戏开发(cocos2d-js) 三、浏览器执行Js 浏览器分为两个部分 渲染引擎

认真,努力,记录学习 7020

javaScript-如何引入js代码

javaScript-如何引入js代码 直接po代码和截图 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>js01-如何引入js代码</title> <script type="text/javascript"> //script标签的...

一只苟延残喘的卑微蝼蚁 1万+

JavaScriptJS语法入门到实战

Javascript语法的基本讲解。

大三小白C++进阶之路 2065

node.jsjavascript的关系

node.js是一个基于 Chrome V8引擎的 JavaScript 运行时环境 一、类比JavaScript和java JavaScript java V8 JVM node.js JRE JavaScript和java都是一门编程语言,至于两者的关系,是雷锋和雷峰塔的关系 V8是google开源的JavaScript引擎,用于执行JavaScript,...

【小石头的茅坑】 71万+

JavaScriptJS对象和JSON

var perStr='{"属性名":"属性值","属性名":"属性值","属性名":{},"属性名":["","",""],"属性名":[{},{},{}]}'3、创建数组并初始化:new Array("one","two",2) ,可简写: var 数组名=[元素,...]9、数组.splice(start,deleteCount,[添加的元素,...])---删除或删除添加原数组元素。1、数组1.concat(数组2)---返回数组1和数组2合并后的新数组。

想做职场小白吗? 我来教您....... 2687

初识JavaScript,体验JS的美好

前言 此次打卡的是一种新的语言,名为 JavaScript,简称 js,是-种运行在客户端的脚本语言, 脚本语言意思是不需要编译,运行过程中由js解释器(js引擎)逐行来进行解释并执行。是不是感到一些好奇呢?现在就带着好奇来感受这个新语言的魅力吧! 一、JavaScript的组成 ECMAScript DOM BOM 1Javascript语法 页面文档对象模型 浏览器对象模型 ECMAScript : ECMAScrip...

txq231254的博客 1666
上一篇: JavaSE笔记4】API、包、String类、Object类
下一篇: python学习笔记 0】简介与安装
烛火萤辉
博客等级 码龄5年 809粉丝 138原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

烛火萤辉

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值