JavaScript--基础ES(一)

JavaScript--基础ES

文章目录

JavaScript--基础ES

1.JavaScript简介

JavaScript是一种基于对象和事件驱动的、并具有安全性能的脚本语言
JS组成
- ES 基础语法
- BOM操作浏览器前进后退刷新等
- DOM操作HTML元素
JavaScript特点
- 向HTML页面中添加交互行为
- 脚本语言，语法和Java类似
- 解释性语言，边执行边解释
JavaScript的基本结构

js 复制代码

<script type="text/javascript">
    
          JavaScript 语句;
   
</script>

JavaScript核心语法
- 变量
- 数据类型
- 数组
- 运算符号
- 控制语句
- 注释
- 输入/输出
- 语法约定
JS引入方式
- 内部JS：使用html下<script>标签
  js 复制代码
```
<script>
    document.write("<h2 style='color:blue'>杨洋0909生日快乐</h2>")
</script>
```
- 外部JS：创建JS文件，使用
  js 复制代码
```
<script src="index.js"></script>
```
- 行内JS：使用触发属性(href，src，事件)
  js 复制代码
```
 <a href="javascript:alert(1)">行内js</a>
```

2.核心语法

2.1变量

使用var关键字(可以省略，但不推荐)

js 复制代码

var a=9,b='杨洋',c=9;
document.write(a,b,c);

2.2数据类型

undefined 变量只声明未赋值，就是undefined
null 与undefined相等
number 整数或浮点数
boolean rue或false
string 用单引号或双引号来声明的字符串

typeof检测变量的返回值

js 复制代码

var b='杨洋';
document.write(typeof(b));//string

2.3String对象

属性

字符串对象.length

js 复制代码

var b='0909';
document.write(b.length);//4

方法

字符串对象.方法名()

js 复制代码

document.write("返回在指定位置的字符"+b.charAt(1)+"<br/>");//y
document.write("c在字符串中首次出现的置"+b.indexOf("c")+"<br/>");//2
document.write("返回位于指定索引3和4之间的字符串"+b.substring(3,4)+"<br/>");//c

方法名称	说明
`charAt(index)`	返回在指定位置的字符
`indexOf(str，index)`	查找某个指定的字符串在字符串中首次出现的位置
`substring(index1，index2)`	返回位于指定索引index1和index2之间的字符串，并且包括索引index1对应的字符，不包括索引index2对应的字符
`split(str)`	将字符串分割为字符串数组

2.4数组

数组创建

js 复制代码

var arr = new Array(大小);
var arr = new Array(值1,值2....);
var arr = [值1,值2.....];
var arr1=new Array(3);
var arr2=new Array(3,4,5);
var arr3=["aa","bb","cc"];

数组属性和方法

类别	名称	描述
属性	length	设置或返回数组中元素的数目
方法	join()	把数组的所有元素放入一个字符串，通过一个的分隔符进行分隔
方法	sort()	数组排序
方法	push()	向数组末尾添加一个或更多元素，并返回新的长度

js 复制代码

  arr1.push("yy");
  arr1.push("ccs");
  document.write("数组排序："+arr2.sort()+"<br/>");
  document.write("数组分隔符分隔："+arr3.join(",")+"<br/>");

2.5运算符号

类型	运算符
算术运算符	+ - * / % ++ ---
赋值运算符	= += -=
比较运算符	> < >= <= == != === !==
逻辑运算符	&& \|\| !

2.6逻辑控制语句

if条件语句

switch多分支语句

js 复制代码

    var num=prompt("请输入一个数字：");
      var n=parseInt(num);
      switch(n){
        case 3:
        case 4:
        case 5:
            console.log("春季");
            break;
        case 6:
        case 7:
        case 8:
            console.log("夏季");
            break;
        case 9:
        case 10:
        case 11:
            console.log("秋季");
            break;
        case 12:
        case 1:
        case 2:
            console.log("冬季");
            break;
      }

for，while循环语句

js 复制代码

     var arr1=new Array();
        arr1.push("yy");
        arr1.push("ccs");
        arr1.push("wyx");
        for(var i=0;i<arr1.length;i++){
            document.write(arr1[i]+"<br/>");
        }

for-in

js 复制代码

  var arr3=["aa","bb","cc"];
        for(var i in arr3){
            document.write(i+"====="+arr3[i]+"<br/>");
        }

2.7注释

单行注释 //
多行注释 /* */

2.8常用的输入输出

alert() 警告框，提示框
prompt() 输入框
confirm() 询问框

js 复制代码

   var num1=prompt("请输入第一个数字：");//输入框
      var num2=prompt("请输入第二个数字：");
      var num3=prompt("请输入第三个数字：");
      if(!isNaN(num1)&&!isNaN(num2)&&!isNaN(num3)){
             //询问框
            if(confirm("是否确认相加计算？")){
                var sum=parseInt(num1)+parseInt(num2)+parseInt(num3);
                alert("计算结果为："+sum);
            }else{
                //提示框
                alert("用户取消计算！！！")
            }
      }else{
        alert("请输入正确的数字！！！");
      }

2.9语法约定

代码区分大小写
变量、对象和函数的名称
分号