JavaScript基础

JavaScript基础

JavaScript

1.特点

  • 解释型
  • 弱类型
  • 基于对象
  • 跨平台型
  • 事件驱动

2.版本

ECNA:欧洲计算机标准协会

  • ECMAScript3.0
  • ECMAScript5.0
  • ECMAScript6.0(ECMA2015)

3.应用领域

  • WEB前端(网页)
  • 后端(node.js)
  • 混合APP(IOS,安卓)
  • 游戏

浏览器中JavaScript的基本语法

1.在HTML中使用JS

引入外部的 js 文件。类似于 CSS的link
<script src="js文件的地址"></script>
<script src="js文件的地址"></script>

在htm中直接写,包裹在script标签中,类似css的style
<script>
    code...  js代码
</script>

2.指令结束符

; 或者换行符

3.注释

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

4.输出内容(一般调试用)

输出到控制台:console.log()
输出到页面:document.write()
输出到弹框:alert()

5.定义变量

var 变量名 = 值;
* var 关键字
* 变量名 由数字、字母、下划线、$ 组成 不能数字开头。 变量名不能使关键字
* 变量名严格区分大小写
* 变量声明 没给值,默认值是undefined

6.JS程序用到的知识点:

弹框
  • 警告框:alert('警告'); 无返回值
  • 确认框:confirm('确认'); 返回true/false
  • 输入框:prompt(''); 返回输入的内容,若点取消返回null
获取页面中的元素作为JS对象

document.getElementById() #返回元素对象

  • 元素对象与 HTML元素 存在映射关系
  • 元素对象用来描述某个HTML元素
  • HTML元素的属性,会映射成 元素对象的 属性
获取双标签内的内容

innerHTML 获取/设置双标签中的内容

7.定义函数

function add(){
    // 获取 用户在 input 中输入的内容
	// 获取元素对象 返回对象 对象描述 id是num1的元素 
    var box1 = document.getElementById('num1');
    var box2 = document.getElementById('num2');
    
    //获取用户在input中输入的值

    var inp_num1 = box1.value;
    var inp_num2 = box2.value;
    
    //判断用户输入是否是纯数字

    if (isNaN(inp_num1)){
        alert('请输入纯数字');
        return;
    }
    if (isNaN(inp_num2)){
        alert('请输入纯数字');
        return;
    }
    
    //把字符串转换为数字
    var num1 = Number(inp_num1);
    var num2 = Number(inp_num2);
    
    //两个数相加
    var res = num1 + num2;
    
    //获取放结果的div元素 innerHTML 获取或者设置 双标签内的内容
    var boxRes = document.getElementById('box');
    boxRex.innerHTML = res;
}

JavaScript数据类型

1.数据类型

  • 原始类型:Number(数字) String(字符串) Boolean(布尔值) Null(空) Undefined(未定义)
  • 对象类型:Object、Array、Date、Math、Error Set(ES6).....

2.Number

  • js不区分 整型和 浮点型

  • 定义方式

    //十进制
    var num = 100
    //十六进制
    var num = 0x10f
    //科学计数法
    var num = 123e100
    
  • 特殊值 NaN

    NaN跟任何值进行任何运算,结果仍然NaN
    跟谁都不相等,包括自己
    
    一般NaN被动产生(数据类型转为Number,不能转为正常的数字,就是NaN函数 isNaN()  判断是不是NaN或者能不能转换为NaN
    

3.字符串

# 单引号
# 双引号
# 反引号 模板字符串  ` ` 
单引号 双引号 没有区别
反引号:
	多行
	可以支持中 ${变量} 添加变量

4.布尔值

true
false

5.Null与undefined

被动产生

6.数据类型转换

  • 强制转换
Number()
字符串:纯数字转为正常的数字,其他NaN
布尔值: true->1  false->0

String()

Boolean()
字符串->布尔: 只有空字符串转为false,其他true
数字->布尔:  0NaNfalse,其他true
nullundefined都会转为false
  • 自动转换
根据运算符 做出适当的类型转换
100 + '20'   数字100自动转换为字符串,得到'10020'
10*'3'       字符串'3'自动转为数字3,得到30

运算符

1.算术运算符

+  加号 正号
-  减法 负号
*  
/
%
++  累加
--  累减

2.比较运算符

>
>=
<
<=
== 相等      两个操作数  只要值相等(类型不同会自动转换) 就相等   
=== 全等     类型和值都要相同才全等
!=  不得
!== 不全等
in 判断 数组的索引 对象的属性 是否存在
instanceof  一个对象是否属于某个构造函数(类)

3.逻辑运算符

&&   逻辑与and
||   逻辑或or
逻辑非not

4.位运算符

&
|
~
^
<<
>>

5.赋值运算符

=
+=
-=
*=
/=
%=

6.其他运算符

+   字符串连接符
?:  比较运算符    表达式?值1:2
typeof  判断类型
delete  删除对象的属性和数组的成员
void  空运算符
,   逗号运算符
posted @ 2018-08-08 17:14  luck_L  阅读(187)  评论(0编辑  收藏  举报