javascript

javascript介绍

JavaScript 是一种客户端脚本语言。运行在客户端浏览器中,每一个浏览器都具备解析 JavaScript 的引擎。

脚本语言:不需要编译,就可以被浏览器直接解析执行了。
核心功能就是增强用户和 HTML 页面的交互过程,让页面有一些动态效果。以此来增强用户的体验!

组成部分
ECMAScript、DOM、BOM

javascript在html页面中的位置

  1. 内部方式
    在<body>标签下通过<script>标签编写代码。
    注意:<script>这个标签必须双标使用</script>
  2. 外部方式
    定义独立的 js 文件,将代码编写在文件中,
    在 HTML 文件的<body>标签下通过<script src=文件路径>来引入 js 文件。

注释

单行注释
// 注释的内容
多行注释
/*
注释的内容
*/

输入输出语句

输入输出语句
输入框
prompt(“提示内容”);
弹出警告框
alert(“提示内容”);
控制台输出
console.log(“显示内容”);
页面内容输出
document.write(“显示内容”);
代码实现

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>输入输出语句</title>
</head>
<body></body>
<script>//输入弹框// prompt("请输入数据:");//弹出警告框alert("hello");//使用频率高//控制台输出console.log("hello fs");//使用频率高//向页面输出内容//document.write("hello world");//不会换行//document.write("<br/>");//借助br标签换行//document.write("hello world");</script>
</html>

常量和变量

JavaScript 属于弱类型的语言,定义变量时不区分具体的数据类型。

定义局部变量
变量名 = 值;

定义全局变量
变量名 = 值;

定义常量
const 常量名 = 值;

<script>//定义一个局部变量let name = "张三";let age = 23;let boolean = true;document.write(name+","+age+","+boolean+"<br/>")//这是局部代码块{//定义局部变量let l1 = "aa";//1.全局变量前面可以不需要任何修饰符l2 = "bb"//2.var 全局变量var l3 = "cc"}// document.write(l1);//这里报错,下面的就不会执行了document.write(l2+"<br/>");document.write(l3+"<br/>");//定义常量const pi = 3.1415926;// pi = 3.1;// 常量不能再次赋值document.write(pi);
</script>

数据类型


typeof 方法
typeof 用于判断变量的数据类型

<script>  //typeof() 通过变量值返回数据类型let l1 = true;document.write(typeof(l1)+"<br/>");//booleanlet l2 = null;document.write(typeof(l2)+"<br/>");//null   实际输出 是Object  是js原始的一个错误let l3;document.write(typeof(l3)+"<br/>");//undefined:代表未定义   let l4 = 10;document.write(typeof(l4)+"<br/>");//numberlet l5 = "hello";document.write(typeof(l5)+"<br/>");//stringlet l6 = 100n;document.write(typeof(l6)+"<br/>");//bigint</script>

运算符

除了下面的两种区别以外,其余的运算符与java中的几乎一致

<script>let num = "10";document.write(num + 5 +"<br/>")//105//数字与字符串通过+号连接是拼接字符串document.write(num + "5" +"<br/>")//105document.write(num - 5 +"<br/>")//5document.write(num * 5 +"<br/>")//50 字符串类型数字进行除了+法运算,会自动类型转换let num2 = 10;document.write(num == num2);//true  == 只比较数据值document.write(num === num2);//false === 比较数据类型&&数据值
</script>

三元运算符

与java的一样

三元运算符格式
(比较表达式) ? 表达式1 : 表达式2;

执行流程
如果比较表达式为true,则取表达式1
如果比较表达式为false,则取表达式2

流程控制语句和循环语句

<script>//和java一模一样//定义变量age并赋值 用ifelse判断年龄大于18的在控制台输出let age = 18;if(age===18){console.log("你年龄复合要求,欢迎来到午夜时刻");}else{console.log("少年,好好学习吧!");}console.log("0-100之间的偶数为:")//打印偶数0-100的for(let i = 0;i<=100;i++){if(i%2===0){document.write(i+",")console.log(i+",")}}//whilelet i = 0;while(i<=100){if(i%2==0){console.log("while,"+i+",")}i++;}
</script>

数组

数组
数组的使用和 java 中的数组基本一致,但是在 JavaScript 中的数组更加灵活,数据类型和长度都没有限制。

定义格式
let 数组名 = [元素1,元素2,…];

索引范围
从 0 开始,最大到数组长度-1

数组长度
数组名.length

数组高级运算符…
数组复制
合并数组
字符串转数组

<script>//定义一个数租let arr = [10,20,30];document.write(...arr+"<br>");document.write("====上面是...arr打印输出====<br>")//在js中数组的长度是可以变化的arr[3] = 40;//遍历数组for(let i = 0; i<arr.length;i++){document.write(arr[i]+"<br/>")}document.write("=====================<br>")//数组的高级运算符//复制数组将arr复制给arr2let arr2 = [...arr];for(let i = 0; i<arr2.length;i++){document.write(arr2[i]+"<br/>")}document.write("=====================<br>")//合并数组let arr3 = [40,50,60];let arr4 = [...arr2,...arr3];for(let i = 0; i<arr4.length;i++){document.write(arr4[i]+"<br/>")}document.write("=====================<br>")//将字符串转成数组let arr5 = [..."xiaofu"];for(let i = 0; i<arr5.length;i++){document.write(arr5[i]+"<br/>")}document.write("=====================<br>")
</script>

函数(方法)

函数类似于 java 中的方法,可以将一些代码进行抽取,达到复用的效果。

定义格式
function 方法名(参数列表) {
方法体;
return 返回值;
}

可变参数
function 方法名(…参数名) {
方法体;
return 返回值;
}

匿名函数
function(参数列表) {
方法体;
}

<script>//定义无参无返回值函数function f1(){document.write("hello xiaofu"+"<br>");}//调用方法f1();//定义一个有参有返回值function getSum(num1,num2){return num1+num2;}//调用方法let sum = getSum(10,20);document.write(sum+"<br>")//定义一个方法,,可变参数对n个数字求和 这里是方法的重载function getSum(...params){let sum = 0;for(let i = 0;i<params.length;i++){sum +=params[i];}return sum;}//调用可变参数的方法let resout = getSum(10,20,30);document.write(resout+"<br>")//匿名函数  function也可以作为一个变量,将函数作为值赋值给变量let fun = function(){document.write("hello"+"<br>");}//调用fun();//定义一个函数来作为一个变量的值let a = function(){let sum = 0;for(let i = 0;i<=100;i++){sum+=i;}return sum;}//调用核函数并打印到页面document.write(a());
</script>

javascript基本语法(输入输出语句,变量常量,数据类型,运算符,流程控制语句,数组,函数)相关推荐

  1. VB.net:VB.net编程语言学习之操作符(变量/常量/数据类型/声明)逻辑控制语句(条件判断/循环语句)的简介、案例应用之详细攻略

    VB.net:VB.net编程语言学习之操作符(变量/常量/数据类型/声明)&逻辑控制语句(条件判断/循环语句)的简介.案例应用之详细攻略 目录 VB.net编程语言学习之操作符/变量/常量/ ...

  2. 使用while循环语句与自增运算符循环遍历数组 (Java经典编程案例)

    大多情况下,遍历数组都是使用for循环语句实现.其实使用while循环语句与自增运算符循环 也能遍历数组,代码如下: /*** 使用while循环语句与自增运算符循环遍历数组*/ public cla ...

  3. JavaScript(一)—— 初识JavaScript/注释/输入输出语句/变量/数据类型

    本篇为 JavaScript 系列笔记第一篇,将陆续更新 文章目录 一.初识 JavaScript 1. JavaScript 是什么 2. JavaScript 的作用 3. HTML.CSS 和 ...

  4. JavaScript基础第01天—编程语言—计算机基础—初始JavaScript—JavaScript注释—JavaScript输入输出语句—变量的使用—数据类型—关键字和保留字

    JavaScript基础第01天 1 - 编程语言 1.1 编程 编程: 就是让计算机为解决某个问题而使用某种程序设计语言编写程序代码,并最终得到结果的过程. 计算机程序: 就是计算机所执行的一系列的 ...

  5. JavaScript基础(一)(编程语言,计算机基础,初始JavaScript,JavaScript注释,输入输出语句,变量的概念,变量的使用,数据类型,解释型语言和编译型语言)

    JavaScript基础第01天 1 - 编程语言 1.1 编程 编程: 就是让计算机为解决某个问题而使用某种程序设计语言编写程序代码,并最终得到结果的过程. 计算机程序: 就是计算机所执行的一系列的 ...

  6. JavaScript基础(第一部分 -- 简介、注释、输入输出、变量、数据类型、运算符、流程控制)

    前言 根据视频和PPT整理 JavaScript基础语法-dom-bom-js-es6新语法-jQuery-数据可视化echarts黑马pink老师前端入门基础视频教程 视频对应资源(在视频简介里面) ...

  7. Javascript - 1 引入方式,变量常量,数据类型,运算符,流程控制,数组,函数,对象,DOM

    Javascipt:是一门弱类型的脚本语言,需要在网页上执行. html负责框架结构,css负责样式修饰,js负责行为交互,动态效果. 前端三大件:html,css,js. javascript 和 ...

  8. Oldboy_day01 Python的历史,变量\常量\数据类型\用户交互\流程控制\循环while

    ###学前动员###:老男孩IT培训的师资力量 讲师:邱彦涛: 项目经理:春生: 班主任:任安安; 银角大王:武sir: 金角大王:Alex: 肖锋:Python web 框架: 马老师:数据库+框架 ...

  9. Web前端学习笔记11:JavaScript_注释_输入输出_变量_数据类型_关键字_保留字_运算符_流程控制

    文章目录 JavaScript基础第01天 1 - 编程语言 1.1 编程 1.2 计算机语言 1.3 编程语言 1.4 翻译器 1.5 编程语言和标记语言区别 总结 2 - 计算机基础 2.1 计算 ...

最新文章

  1. 用神经网络分类水和乙醇
  2. tkinter 笔记 :主体框架窗口内容
  3. 最常见的读入数据方法集锦
  4. 用了都说好的SCI在线绘图工具来了~~~~~~~
  5. 程序员休闲娱乐之数独!| 技术头条
  6. springboot主线程_springboot中的多线程.md
  7. dw怎么写html,dw怎么写html
  8. sublime清除html里面的空白行,Sublime Text批量删除空白行和注释代码
  9. python控制键盘游戏内无效_python 采坑总结 调用键盘事件后导致键盘失灵的可能原因...
  10. 通用oa系统_点晴:免费OA系统V20,让协同办公无处不在
  11. SAP 云平台 (Cloud Platform) 架构概述
  12. Fllutter TabBar中文文字抖动完美解决方案
  13. 经济形势这么差为什么要创业——Why to Start a Startup in a Bad Economy
  14. 安卓手机如何查看手机控制台输出
  15. 私域论坛圈子社区小程序开发
  16. SQL SERVER 语句的谓词ANY、ALL的意思
  17. HDU--1010--Tempter of the Bone
  18. “On Writing Well” 读书总结
  19. js中终止forEach循环的方法
  20. 中兴交换机忘记enable密码,如何更改?

热门文章

  1. Axure函数与变量
  2. Emit学习-进阶篇-定义事件
  3. char* 和 char * 思考
  4. 解决每次从cmd进入sqlplus,都得重新设置pagesize、linesize的问题
  5. 合唱队(最长子序列问题)
  6. SharePoint Server 2007 trial --- 年末大餐细细品尝 (第七口)
  7. 三个对CS最大的谬误
  8. 好长时间没有到博客园来看看了
  9. [Hadoop in China 2011] 邵铮:揭秘FaceBook Puma演变及发展
  10. Echarts图标自适应问题(已解决)