JavaScript简介以及基本语法和数据类型

最新推荐文章于 2024-04-21 15:16:36 发布

ab_dk

最新推荐文章于 2024-04-21 15:16:36 发布

阅读量248

点赞数

文章标签： javascript html

本文链接：https://blog.csdn.net/ab_dk/article/details/104764911

版权

1.JavaScript的基本介绍
JavaScript的历史
1994年 , 网景公司推出了第一款真正意义上的浏览器
1995年 , sun 公司推出了Java
1995年 , 网景公司 , sun公司和网景公司的员工布兰登 · 艾克一起开发了 JavaScript
JavaScript是什么
轻量级弱类型脚本语言
JavaScript 的作用
实现页面的交互 : 用户操作的交互 , 数据的交互
JavaScript 的组成部分
① ECMAScript
JavaScript的基本语法规范
② DOM
文档对象模型 – 操作HTML,css
③ BOM
浏览器对象模型 – 操作浏览器

2.JavaScript的三种语法
①行内式 ------不推荐使用
css的行内式,在标签内部直接定义css代码
JavaScript的行内式,也是在标签内部直接定义JavaScript代码
例如：<div style="color: red;" onclick="alert('我是div标签的弹窗')">我是div标签</div>
②内部式
css的内部式,在head标签中,定义style标签,然后通过选择器来定义标签样式
JavaScript的内部式,在 head标签的最后,或者body标签的最后,来定义一个script标签,在标签内部来定义JavaScript代码
例如：

	<body>
			<p id="p1">我是p标签</p>
			<script>
				        // 给p标签,添加JavaScript程序,要添加时,必须页面中已经有p标签
				        p1.onclick = function(){
				            window.alert('我是p标签,弹出的内容')
				        }
			 </script> 
	</body>

3.特殊的html标签
超链接是一个特殊的标签,特殊在如果要执行JavaScript程序，超链接标签,href的属性值,必须定义为 JavaScript:; 才会执行
定义超链接的跳转,应该是在href属性中,来定义跳转页面的url地址
现在,在JavaScript中,要定义 href 属性为 JavaScript:;
然后通过JavaScript的语法形式来定义,跳转页面
如果是在href中,定义跳转地址,那么很多JavaScript程序就无法执行了
通过 JavaScript来定义跳转, 可以实现JavaScript的一些功能
<a href="JavaScript:;" id="a1">百度</a>

<script>                              当a的值为1/2/3时，分别跳转百度/搜狐/qq界面
    a1.onclick = function(){
        var a = 3;
        if(a == 1){
            window.location.href = 'https://www.baidu.com';
        }else if(a == 2){
            window.location.href = 'https://www.sohu.com';
        }else if(a == 3){
            window.location.href = 'https://www.qq.com';
        }
    }
</script>

4.JavaScript的注释
单行注释： // 单行注释
多行注释： /* 多行注释，可以换行快捷键为ctrl+/ */

5.变量
1.变量的定义
官方定义: 存储在内存之中的,带有名称的,数据信息,其中存储的数据,在执行过程中,是可以改变的
实际上就是容器 , 存储数据的容器
所有的计算机程序,数据都会存储咋变量中,通过操作变量,来操作数据
2.定义变量的语法形式
var name = " 张三 "
声明一个叫name的变量，将“张三”这个数据，赋值给name这个变量来存储，而不是name这个变量等于“张三”这个数据 name变量名称和“张三”数据都是根据实际需求定义的，可以变换
var-------- 声明变量的关键词，告诉计算机我正在定义的是一个变量
name ------- 定义的变量的名称，之后通过变量的名称来调用数据
= -------- 等号，在计算机程序中，为赋值符号，作用时将等号右侧内容赋值给左侧变量储
存，不是数学中等于的意思
“ 张三 ” ------ 存储在变量中的数据
； -------- 每行JavaScript程序，最好用分号做结束

6.数据的分类
JavaScript中,对于变量可以存储的数据,有分类
基本数据类型 / 标准数据类型
布尔类型 , 数值类型 , 字符串类型 , undefined , null
引用数据类型 / 复杂数据类型 / 地址数据类型
数组 , 对象 , 函数

7.数据类型之布尔类型
在计算机语言中,布尔值,表示真 / 假这样的两个数值
表示真 / 正确的数值是 true
表示假 / 错误的数值是 false
布尔值,往往是比较或者判断的结果
在 JavaScript中,表示布尔类型的英文是 Boolean / bool

var a = 100 ;
console.log( a );
在控制台console中查看/输出 a变量中存储的数值 --> 100

var a = 4 > 3 ;
console.log( b );
右侧的内容是 4>3 的一个比较判断 , 判断的结果是真 / 正确
在JavaScript中正确的结果,使用 true 来表示
变量b 中存储的就是 true

var a = 4 < 3 ;
console.log( c );
在变量c中存储的是 4<3 的结果,是假 / 错误
在JavaScript中错误的结果,使用false 来表示

可以对变量直接进行赋值,赋值的内容是 true 或者 false
但是要注意,这里的true和fasle必须小写,如果大写就会报错,因为就不是布尔值了
直接赋值布尔值
var d = true;
var e = false;
console.log(d,e);
true , false 作为布尔值,可以直接使用
console.log(true , false);

8.数据类型之字符串类型
所谓的字符串类型,就是由字符,数字,符号等,组成的一串数据类型，JavaScript中使用 String / str 表示字符串类型
字符串类型的数据,必须使用单引号或者双引号来已经包裹
在JavaScript中,单引号,双引号,没有区别,用那个都行，但是必须成对使用，必须是英文格式的符号
var a = 北京 ; 语法错误,会报错
var a = “北京” ; 正确语法
console.log(a);

特殊情况1: 如果一个数字,也被引号包裹,那么这个数字,也是字符串类型
var b = 123; // 变量b中存储的是数值 123
var c = “123”; // 变量c中存储的是字符串 123
console.log(b,c);
特殊情况2: 引号的嵌套 : 双引号中只能嵌套,单引号,不能嵌套双引号
单引号中只能嵌套,双引号,不能嵌套单引号
var d = "邹烨说:‘张老师,能不能开个车提提神’,说我:‘不能~~~!!!’ ";
var e = '邹烨说:“张老师,能不能开个车提提神”,说我:“不能~~~!!!” ';
console.log(d);
console.log(e);
特殊情况3: 字符串的拼接
将两个字符串,拼接为一个字符串,称为字符串的拼接
在JavaScript中,字符串的拼接,使用 + 加号来表示

将两个字符串的内容,拼接为一个字符串,赋值给变量存储
可以多个字符串,多次拼接

        var str3 = str1 + str2 + '<br>' + str1 + str2  ;
        console.log(str3);

在页面中输出要执行换行效果,拼接上换行标签即可
换行标签页必须是字符串形式
console.log() 控制台输出,不支持标签效果
document.write( str3 );
9.数据类型之数值类型整数
JavaScript中,数值类型包括:
整数 , 小数 , NaN 3种数值形式

① 整数: integer / int
在计算机程序中,常用的整数类型有
二进制 : 0 , 1
八进制 : 0 , 1 , 2 , 3 , 4 , 5 , 6 , 7
十进制 : 0 - 9
十六进制 : 0 - 9 a - f
要计算,可以使用计算器，关键是各种进制的数值,在JavaScript中如何存储这里特指的是整数
变量中要存储的整数是二进制数值需要在二进制数值前添加 0B 或者 0b 零b 或者零B，例如： var a = 0b11111001;
console.log(a); // 默认将存储数值,转化为十进制输出
console.log( a.toString(2) ); // 默认将存储数值,转化为二进制输出

    // 存储时,是按照二进制数值存储,输出时,默认都是按照十进制数值输出
    // 如果需要按照原始进制数值输出
    // 变量名称.toString(进制)  S必须大写
    // 将数值转化为字符串形式输出

八进制在存储数值之前添加0
按照八进制输出, toString(),小括号中写8
var b = 0371;
console.log(b);
console.log( b.toString(8) );
十进制正常输入就可以
var c = 248;

十六进制输入数值前,加 0x 零x 或者 0X 零X
var d = 0xf9;
console.log(d)
console.log( d.toString(16) );

10.数据类型之数值类型浮点数
浮点数 , 也就是小数 float

①.有效数字 / 有效数值
在数学中,小数的小数位数,可以是无穷位
在JavaScript中,对于浮点数的总位数有规定
一个浮点数,有效数字/有效数值,最多 17 位
所谓的有效数字,值得是,左起,非零的数值
整数部分,小数部分,一共是17位
直接截取有效部分,而不是四舍五入

       console.log(12345.67890123456789012345);  只显示前17个数

②.科学计数法
记录表示数值的一种语法形式
数值 e 数值
2 e 3 2 乘以 10的3次方 2 * (101010)
2 e -3 2 除以 10的3次方 2 / (101010)
关键: 使用科学技术法表示的数值,即时是一个整数,计算机中也是按照浮点数来分类的
2e3表示的是 2000 ,是一个整数,但是计算机程序,仍然会将这个整数,当做浮点数来处理

console.log( 2e3 );     // 2000
console.log( 2e-3 );   // 0.002

③.浮点数的误差 — 浮点数的精度丢失 / 精度溢出
在计算机程序中,浮点数的存储,存储内容,不是准确值,而是近似值
在计算机中,就会造成浮点数执行时,计算的误差,也称作精度丢失/精度溢出
但是这种情况不是任何时候都会体现出来
这样的错误,在特殊情况下会体现出来

解决方案,是用高精度浮点来执行计算 float类型转 double 类型

经典面试题:
写出以下程序的执行结果

== 两个等号表示判断两侧的内容是否相等

    console.log( 0.1 + 0.2 == 0.3 )
    console.log( 0.2 + 0.2 == 0.4 )
    console.log( 0.3 + 0.3 == 0.6 )

这是错误的语法形式,我在实际项目中,根本不会这么写，浮点数因为存储方式的问题,直
接执行运算或者比较,会造成精度溢出或者精度丢失的现象，造成执行的误差，我会将浮
点数,转化为高精度浮点数 , 在进行运算,会避免这样的问题发生

11.数据类型之undefined和null
undefined和null，是JavaScript中的两种数据类型
undefined 表示没有数值 — 应该有数值,但是现在没有数值
null 表示数值为空 — 表示有数值,但是数值是"空"

可以直接给变量,赋值 undefined 和 null，也是必须小写

定义int1 但是没有赋值数值

	var int1 ;
    console.log(int1);

输出时,int1 应该有数值,但是现在没有数值
输出的结果就是 undefined

定义一个变量,并且赋值null

	var int2 = null;
	console.log( int2 );
	var int3 = undefined;
	console.log( int3 );

总结:
true , false , undefined , null , NaN
在JavaScript中,表示的是一种数值
赋值时,必须严格遵守大小写规范
并且,不能带引号 , 如果有引号,就是字符串,就不是原有的数值了

ab_dk

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript简介以及基本语法和数据类型

1.JavaScript的基本介绍JavaScript的历史1994年 , 网景公司推出了第一款真正意义上的浏览器1995年 , sun 公司推出了Java1995年 , 网景公司 , sun公司和网景公司的员工布兰登 · 艾克一起开发了 JavaScriptJavaScript是什么轻量级弱类型脚本语言JavaScript 的作用实现页面的交互 : 用户操作的交互...
复制链接

扫一扫