JavaScript基础和数据类型

在飞行-米龙

已于 2024-02-23 20:30:09 修改

阅读量815

点赞数 20

分类专栏：前端文章标签： javascript 开发语言前端

于 2024-02-22 20:04:19 首次发布

本文链接：https://blog.csdn.net/weixin_48183870/article/details/136242271

版权

前端专栏收录该内容

10 篇文章 0 订阅

订阅专栏

【一】JavaScipt基础

【1】什么是JavaScript

（1）定义

JavaScript最初由Netscape公司（现在的Mozilla基金会）的Brendan Eich在1995年创造。
JavaScript是一种广泛用于网页开发的脚本语言。
它是一种动态、解释性的语言，可以在网页上实现复杂的交互和动态效果。
JavaScript通常用于前端开发，用于改变网页的内容、样式和行为，以及与用户进行交互。

（2）特点

它是一种解释性的语言，不需要编译，可以直接在网页上运行。
它是一种动态类型语言，变量的类型可以在运行时改变。
它支持面向对象编程（OOP）和函数式编程（FP）的范式。
它具有丰富的内置对象和方法，可以用于处理字符串、数组、日期、正则表达式等。
它可以与HTML和CSS无缝集成，通过DOM（文档对象模型）和CSSOM（CSS对象模型）操作网页元素和样式。
它具有广泛的第三方库和框架，如React、Angular和Vue.js，可以简化开发过程并提供更丰富的功能。
注意：在JavaScript中，分号（;）用于表示语句的结束。

【2】注释语法

在JavaScript中，注释是用于在代码中添加说明和备注的文本，它们不会被执行或解释为代码的一部分。
注释对于代码的可读性和维护性非常重要，可以帮助其他开发人员理解代码的意图和功能。

（1）单行注释

// 注释内容

（2）多行注释

/*
注释内容
*/

【3】调试工具

（1）`alert`

alert 是一个弹出窗口，用于显示一条消息给用户
它可以用于调试目的，将特定的值或消息显示给用户
alert 方法会阻塞代码的执行，直到用户关闭弹出窗口为止。

alert('Surprise!')

（2）`prompt`

prompt 是一个弹出窗口，用于接收用户的输入，并将输入的值作为返回值返回给代码
用于调试，以便在代码中获取用户的输入值。

var name = prompt("username:>>>");

（3）`console`

console 是一个用于在浏览器控制台输出调试信息的对象。
它提供了一组方法，如 log、warn、error 等，用于输出不同级别的调试信息。

console.log(123)

【3】引入方式

（1）写在script标签里面

body内书写：行内书写、body最下面
head内书写

<!DOCTYPE html>
<html>
<head>
<script>
    <!-- js代码  -->
</script>
</head>
<body>
    <div onclick="(alert('Surprise!'))">click me !</div>
    
<script>
    <!-- js代码  -->
</script>    
</body>   
</html>

（2）写在Js文件里面

在script标签中指定js文件路径

<!DOCTYPE html>
<html>
<head>
    <script src='javascript.js'></script>
</head>
<body>
</body>
</html>

【二】基本数据类型

【1】字面量

字面量是直接表示数据的固定值。
它们是在代码中直接使用的值，不需要通过变量或常量进行存储。
JavaScript中常见的字面量包括数字字面量、字符串字面量、布尔字面量、数组字面量和对象字面量等。

3.14
’hello‘
true

【2】变量和常量

（1）变量

变量是用于存储和引用数据的标识符。
建议命名为小写字母开头的驼峰体
在JavaScript中，可以使用 var或let 声明变量。

var x = 5;
let y = "Hello";

1.1var和let的区别

作用域：var 是函数级作用域， let 是块级作用域
var 在循环内定义也会影响到全局， 和python一样
let 在局部定义只会在局部生效，6.0版本以上可以用

var i = 10;
for (var i=0; i<4; i++){}
console.log(i)
# 4

let i = 10;
for (let i=0; i<4; i++){}
console.log(i)
# 10

提升：var 声明的变量会被提升到其作用域的顶部。这意味着你可以在声明变量之前使用变量，而变量的值将是 undefined。let 声明的变量也会被提升，但是你不能在声明之前使用它们，否则会抛出 ReferenceError。这个区间被称为“暂时性死区”。

console.log(x);  //undefined
var x = 5;

console.log(y);  //ReferenceError
let y = 5;

重声明：在同一个作用域中，var 允许你重新声明同一个变量，而 let 不允许。
```
var x = 1;
var x = 2;  //可以

let y = 1;
let y = 2;  //SyntaxError
```

（2）常量

常量是指在程序执行期间不可更改的值。
在JavaScript中，可以使用 const 关键字声明常量。常量一旦被赋值后，其值就不能再被修改

python并没有真正意义上的常量

const PI = 3.14
undefined
PI = 3.145
Uncaught TypeError: Assignment to constant variable.
    at <anonymous>:1:4

【3】数值类型

数值类型是一种原始数据类型，用于存储数值，可以进行数学运算和比较操作。

（1）定义数据

var age = 18;		//整数
var pi = 3.14;		//小数
var salary = 2e5;  //200000
var a = -0.5;		//负数

var biggest = Infinity;		//无穷大
var smallest = -Infinity;	//无穷小
var b = NaN;		//Not a number 非数值类型

（2）查看数据类型typeof

typeof a;
// 'number'
typeof biggest;
// 'number'
typeof b;
// 'number'

（3）类型转换

parseInt：转换为整数
parseFloat：转换为浮点数
- 字符串可以转换为数字
- 开头是数字就能转换前面的数字
- 无法转换就是NaN

console.log(parseInt(11.99)); //11
console.log(parseInt("11.99"));	//11
console.log(parseFloat("11.99"));	//11.99
console.log(parseInt("123aa"));	//123
console.log(parseInt("aa"));	//NaN

【4】字符串类型

（1）定义并查看类型

var name = 'bruce';
var hobby = "running";

typeof name;	//'string'
typeof hobby;	//'string'

（2）模板字符串(这是反引号`)

var introduce = `name: ${name} hobby: ${hobby}`;
console.log(introduce);	//name: bruce hobby: running

（3）常用方法

3.1拼接字符串

+号
.concate()

var a = "123";
var b = "456";
var c = a + b;	//'123456'
c.concat(a, b) //'123456123456' 没接收所以c实际不变

3.2字符串长度

.length

c.length; //6

3.3移除空白

.trim()：移除两端空白
.trimLeft()：移除左端空白
.trimRight()：移除右端空白
python可以指定字符，trim不行

var name = '  bruce   ';
name.trim();	//'bruce'
name.trimLeft();	//'bruce   '
name.trimRight();	//'  bruce'

var hobby = '$swimming';
hobby.trim("$");	//'$swimming'

3.4索引

.charAt(n)：返回索引为n的值
.indexOf(“str”)：返回字符串所在的索引位置

var introduce = "hello my name is bruce";
introduce.charAt(4);	//'0'
introduce.CharAt(100);	//''

introduce.indexOf('name');	//9

3.5切片

.slice(m, n)：[m, n)
.substring(m, n)：[m, n)，不支持负数

var introduce = "my name is bruce";
introduce.slice(3, 7);	//'name'
introduce.slice(0, -1);	//'my name is bruc'
introduce.substring(0, -1); //''

3.6大小写转换

.toLowerCase()
.toUpperCase()

var name = "Bruce";
name.toLowerCase();	//'bruce'
name.toUpperCase(); //'BRUCE'

3.7切分

.split(‘str’)
.split(‘str’, n) 和Python运行结果不同，只保留前n个

var hobby = 'run|eat|play|swim|see';
hobby.split("|");
//(5) ['run', 'eat', 'play', 'swim', 'see']
hobby.split("|", 2);
//(2) ['run', 'eat']

# python中
hobby = 'run|eat|play|swim|see'
print(hobby.split("|", 2))
# ['run', 'eat', 'play|swim|see']

3.8类型转换

通过+号
String
.toString()：数组可以，单独的数字不行

typeof(2 + "");	//'string'
typeof(String(2)); 	//'string'
typeof([2].toString()); 	//'string'

【5】布尔类型

（1）定义并查看类型

注意：需要全小写

var flag = true;
var indetify = false;
typeof flag;	//'boolean'

（2）分类

2.1为假

空字符串
0
null
undefined
NaN

2.2为真

其他为真

（3）类型转换

Boolean()

Boolean(null);	//false
Boolean(NaN);	//false

【6】null和undefined

（1）`undefined`

当一个变量声明但未赋值时，或者访问对象属性或数组元素时不存在时，该值被视为undefined。
它表示一个未定义或缺少值的状态

var name;
console.log(name); //undefined

var arr = [1, 2, 3];
console.log(arr[3]); //undefined

（2）null

表示一个空值或不存在的对象。
一般都是指定或者清空一个变量时使用

var y = null;
console.log(y); //null

在飞行-米龙

关注

20
点赞
踩
20

收藏

觉得还不错? 一键收藏
0
评论
JavaScript基础和数据类型

JavaScript最初由Netscape公司（现在的Mozilla基金会）的Brendan Eich在1995年创造。JavaScript是一种广泛用于网页开发的脚本语言。它是一种动态、解释性的语言，可以在网页上实现复杂的交互和动态效果。JavaScript通常用于前端开发，用于改变网页的内容、样式和行为，以及与用户进行交互。//整数//小数//200000//负数//无穷大//无穷小//Not a number 非数值类型//'string'//'string'
复制链接

扫一扫