当前位置: 首页 > news >正文

JS#1 引入方式和基础语法

JavaScript(JS)是一门跨平台, 面向对象的脚本语言, 来控制网页行为的, 它能够是网页可交互

一. 引入方式

  1. 内部脚本与外部脚本

内部脚本: 将JS代码定义在HTML页面中

外部脚本: 将JS代码定义在外部JS文件中, 然后引入到HTML页面中

注意: 在HTML中,JS代码必须位于<script></script>标签之间

<script>标签可以防止HTML文档的任意地方,但一般都将脚本置于<body>的底部

  1. 代码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>JS引入方式</title>
</head>
<body><!--JS第一种引入方式-->
<!--<script>alert("Hello JS");
</script>--><!--JS第二种引入方式-->
<script src="../JS/demo1.js"></script>
</body>
</html>
alert("Hello JS");
  1. 效果展示

二. 基础语法

一. 书写语法

  • 区分大小写

  • 每行结尾的分号可有可无

  • 注释和java一样

  • 大括号表示代码块

二. 输出语句

  1. 介绍

  • 使用window.alert( ) 写入警告窗(window. 可以省略)

  • 使用document.write( ) 写入HTML输出

  • 使用console.log( ) 写入浏览器控制台

  1. 代码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>js输出语句</title>
</head>
<body><script src="../js/demo.js"></script>
</body>
</html>
window.alert("Hello js1");//写入警告框
document.write("Hello js2");//写入HTML控制台
console.log("Hello js3");//写入浏览器控制台
  1. 效果展示

三. 变量

  • JavaScript 中用 var(variable)关键字来声明变量(可重复声明)

  • JavaScript 是一门弱类型语言,变量可以存放不同类型的值

  • 变量名需要遵循如下规则

组成字符可以是任何字母、数字、下划线(_)或美元符号 ($)

数字不能开头

建议使用驼峰命名

  • ECMAScript6新增了let 关键字来定义变量。它的用法类似于 var,但是所声明的变量,只在 let 关键字所在的代码块内有效,且不允许重复声明

  • ECMAScript6新增了 const关键字,用来声明一个只读的常量, 一旦声明,常量的值就不能改变

四. 数据类型

原始类型和引用类型5种原始类型:

  • number: 数字(整数、小数、NaN(Not a Number))

  • string: 字符、字符串,单双引皆可

  • boolean: 布尔, true,false

  • null: 对象为空

  • undefined: 当声明的变量未初始化时,该变量的默认值是undefined

使用typeof运算符可以获取数据类型

alert(typeof 变量名)

五. 运算符

  1. 简介

  • 一元运算符: ++,算术运算符:+,-,*,/,%

  • 赋值运算符:=,+=,-=...

  • 关系运算符:>,<,>=,<=,!,==, ===

  • 逻辑运算符: &&, ||,!

  • 三元运算符:条件表达式?true_value :false_value

=== 与== 的区别(== 会进行类型转换, ===不会进行类型转换)

  1. 类型转换

其他类型转为number:

  • string: 按照字符串的字面值,转为数字, 如果字面值不是数字, 则转为Na, 一般使用parseIn

  • booLean: true 转为1,false转为0

其他类型转为boolean:

  • 1. number:@和NaN转为false,其他的数字转为true

  • 2. string:空字符串转为false,其他的字符串转为true

  • null:false

  • 4. undefined: false

六. 流程控制语句

与Java语法一样

  • if:

  • switch:

  • for:

  • while:

  • do...while:

七. 函数

  1. 定义方法的两种方式

  1. function functionName(参数1,参数2...){

要执行的代码

}

  1. var functionName = function(参数列表){

要执行的代码

}

  1. 代码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>函数</title>
</head>
<body><script><!--第一种方法--><!--定义方法-->function add(a,b){return a + b;}<!--调用方法-->var result = add(1,2);alert(result);<!--3--><!--第二种方法-->var add2 = function(a,b){return a + b;}var result2 = add2(3,6);alert(result2);<!--9-->
</script>
</body>
</html>

http://www.lryc.cn/news/23884.html

相关文章:

  • 面了一个测试工程师,明显感觉他背了很多面试题...
  • C#生成缩略图
  • 算法 # SimHash 算法:文本相似度、文本去重、海量文本快速查询
  • Java程序设计-JSP程序设计-SSM校园二手交易系统
  • springBoot 消息转换器和自定义消息转换器
  • 机器学习笔记之流形模型——标准流模型基本介绍
  • MIT:只需一层RF传感器,就能为AR头显赋予“X光”穿透视力
  • 对 Dom 树的理解
  • 电商搜索入门
  • 4.3.1初阶数据结构(C语言)(无头不循环单链表)
  • 一文深度解读音视频行业技术发展历程
  • 面向对象拓展贴
  • Android仿QQ未读消息拖拽粘性效果
  • Linux 打包压缩解压指令 gzip bzip2 tar
  • 系统升级丨分享返佣,助力商企实现低成本高转化营销
  • 机试代码模板
  • Java性能优化-垃圾回收算法-理解CMS回收器
  • Oracle11G的表空间数据文件大小限制问题处理
  • 计算机三级|网络技术|备考指南|网络系统结构与设计的基本原则|1
  • 基于 TI Sitara系列 AM64x核心板——程序自启动说明
  • 自学5个月Java找到了9K的工作,我的方式值得大家借鉴 第一部分
  • 微电影广告的内容突破方案
  • 茌平区为什么越来越多的企业由请高新技术企业?山东同邦科技分享
  • 谷歌优化排名怎么做出来的?谷歌排名多久做上去?
  • 字节跳动青训营--Webpack
  • 微信多媒体文件speex格式转为mp3文件格式
  • IAP初探
  • 【组织架构】中国铁路兰州局集团有限公司
  • 【计算机三级网络技术】 第四篇 路由设计技术基础
  • 嵌入式工程师进阶,基于AM64x开发板的IPC多核开发案例分享