JavaScript基础

Javascript 是一种由 Netscape( 网景 ) 的 LiveScript 发展而来的原型化继承的面向对象的动态类型的区
分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl ,遗留的速度问题,为客户提供更流畅的浏览效果。当时服务端需要对数据进行验证,由于网络速度相当换缓慢,只有 28.8kbps ,验证步骤浪费的时间太多。于是Netscape 的浏览器 Navigator 加入了 Javascript ,提供了数据验证的基本功能。JavaScript 的正式名称是 "ECMAScript" 。这个标准由 ECMA 组织发展和维护。 ECMA-262 是正式的 JavaScript标准。这个标准基于 JavaScript (Netscape) 和 JScript (Microsoft) 。 Netscape(Navigator 2.0) 的Brendan Eich 发明了这门语言,从 1996 年开始,已经出现在所有的 Netscape 和 Microsoft 浏览器中。ECMA-262的开发始于 1996 年,在 1997 年 7 月, ECMA 会员大会采纳了它的首个版本。 JavaScript 的组成包含ECMAScript 、 DOM 、 BOM 。 JS 是一种运行于浏览器端上的小脚本语句 , 可以实现网页如文本内容
动 , 数据动态变化和动画特效等。


JS 特点:
JS 是运行在浏览器上的 一种脚本语言


1.脚本语言


脚本语言是一种简单的程序,规模小 , 不需要编译 , 运行快 , 是由一些 ASCII 字符构成,可以使用任何一种文本编辑器编写。脚本语言是指在web 浏览器内有解释器解释执行的编程语言,每次运行程序的时候,解释器会把程序代码翻译成可执行的格式。一些程序语言(如C 、 C++ 、 Java 等)都必须经过编译,将源代码编译成二进制的可执行文件之后才能运行,而脚本语言不需要事先编译,只要有一个与其相适应的解释器就可以执行。

**2.**基于面向对象的语言


面向对象有三大特点(封装,继承,多态)缺一不可。


**3.**事件驱动

在网页中执行了某种操作的动作,被称为 " 事件 "(Event) ,比如按下鼠标、移动窗口、选择菜单等都可以视为事件。当事件发生后,可能会引起相应的事件响应。


**4.**简单性

变量类型是采用弱类型,并未使用严格的数据类型。
var a,b,c; a=123; b="abc"; a=b;


**5.**安全性

JavaScript 不能访问本地的硬盘,不能将数据存入到服务器上,不能对网络文档进行修改和删除,只能通过浏览器实现信息浏览或动态交互


**6.**跨平台性

JavaScript 依赖于浏览器本身,与操作平台无关,只要计算机安装了支持 JavaScript 的浏览器(装有JavaScript解释器), JavaScript 程序就可以正确执行。
缺点:
各种浏览器支持 JavaScript 的程度是不一样的,支持和不完全支持 JavaScript 的浏览器在浏览同一个带有JavaScript 脚本的网页时,效果会有一定的差距,有时甚至会显示不出来。


HTMLCSSJS****这之间的关系

HTML 和 CSS 和 JS 都是前端的主要技术 , 三者各有分工 .HTML 可以用于制作网页的主体结构 ,CSS 用于给网页做美化,JS 用于在网页上添加动态效果


基本语法:

<script type="text/javascript">
alert("javaScript 你好,我来了!!");
</script>

核心语法约定
1 、代码区分大小写
javaScript 的关键字小写
内置对象大写字母开头,对象名称通常是小写,方法函数命名规则采用驼峰命名法。
2 、变量、对象和函数的名称
标识符命名规范:只能包含数字、字母、下划线和 $ ,且不能以数字开头,不能使用 javaScript 关键字 与保留字。
3 、分号表示结束符
注意:按语法可以省略,但行业内部要求一般都写上。


一、脚本的引入方式

1 、行内引入

<body>
你好,javaScript ,我们来了!!
<a onclick="javaScript:alert('你点了我!');">行内引入</a>
</body>

注意:当 js 需要用到引号的时候,由于写标签已经用了双引号,所以写成单引号。


2**、内嵌**

<script type="text/javascript">
alert("内嵌方式");
</script>

其中 html5 默认 type 属性的值为 "text/javascript", 因此可以不写,但是不推荐省略。


3**、外部**

A 、创建一个扩展名为 js 的文件,并写 js 代码
B 、在目标页面引入该 js 文件

<script type="text/javascript" src="js/main.js">
</script>

src 表示要引入的外部 js 脚本文件的完整路径
小结: script 标签可以在页面中有多段 js 程序, js 代码的引入可以在 head 中,也可以在 body 中。


外部引用优点:
代码复用度高,更易于维护代码
注意事项:
1 、在一个页面上可以同时引入多个 js 文件
2 、每个 js 的文件 的引入都要使用一个独立的 script 标签


二、js注释

方便阅读代码,有利于代码维护及协同开发。
1 、单行注释

注释一行 //开始 ctrl + /

2 、多行注释

/* 注释的内容 */ ctrl + shift + /

三、js输入**/**输出方式

输出方式
1 、弹出提示框
以弹框的形式在页面中输出要显示的内容
alert(" 里面是我们要显示的内容 ");


2 、在页面中输出信息
A 、输出简单的信息

<script type="text/javascript">
document.write("这是我们要在页面中输出的内容");
</script>

B 、输出格式的内容信息(含 html 标签)

<script type="text/javascript">
document.write("这<h2>是我</h2>们要<br/>在页面中输出的内容");
</script>

注意引号的使用,不要同时使用同一个引号
document 对象指的是 html 文档本身
其中 "." 操作符可以直接调用该对象的功能或值。


3 、控制台日志信息
console 表示控制台对象,在大多数浏览器中要打开控制台,可以按快捷键 f12 选择 console 选项卡。
1 、控制台普通信息

console.info("我是控制台日志信息");

2 、控制台日志信息

console.log("我是控制台日志信息");

输入方式
1 、确定框
confirm(" 需要提示的信息 !");
会有两个按钮 确定 . 取消

<script type="text/javascript">
var result;
result = confirm("需要提示的信息!");
document.write("操作结果:"+result);
</script>

学完变量我们就会发现,想要知道操作的结果并存起来使用,那么我们可以使用变量接收操作结果。
2 、信息输入对话框
prompt(" 请输入年龄: ") ; 接收用户输入的数据

var result;
result = prompt("请输入年龄:");
document.write("操作结果:"+result);

prompt(" 你确定要删除么? ",18); 接收用户输入的数据,后一个默认值


感谢大家的阅读,如有不对的地方,可以私信我,感谢大家!

相关推荐
听潮阁13 分钟前
【SpringCloud详细教程】-04-服务容错--Sentinel
java·开发语言·spring boot·spring cloud·eclipse·tomcat
海涛高软27 分钟前
QT配置文件详解
开发语言·qt
Object~29 分钟前
【第十二课】Rust并发编程(三)
开发语言·后端·rust
cwtlw1 小时前
数据库学习记录02
开发语言·数据库·笔记·sql·学习
cllsse1 小时前
python控制鼠标,键盘,adb
开发语言·python·计算机外设
GISer_Jing1 小时前
Vue前端进阶面试题(六)
前端·javascript·vue.js
AI原吾1 小时前
探索Python WebSocket新境界:picows库揭秘
开发语言·python·websocket·picows
YueiL1 小时前
数据结构每日一题|判断链表是否有环型结构
javascript·数据结构·链表
FenceRain2 小时前
uniapp 扩展picker-view实现条件查询
前端·javascript·uni-app
尾张大2 小时前
solana java 转账交易示例
java·开发语言