提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  Javascript

当前栏目

JavaScript 行内 | 内嵌 | 外链

2023-02-18 16:38:30 时间

学习方法

JS基础主要是认识语法，以后的大部分知识点都在此基础上扩展和延伸，我们学一部分常用的。
类似于学中文，不必把字典学完。

JS体系: ECMAScript  DOM  BOM  JS的原型链(typescript), ES5,ES6,Node, Vue,React

学习目标

熟练掌握JS基础语法的相关概念和写法
学完JS基础你并不能做什么?但是以后的所有学习都跟这个有关系，就像读小学，只是打基础，但是却很重要。

知识讲解

JS的三种书写方式

行内JS 很少用
内嵌JS 学习的时候用(少量代码也可以)
外链JS 做项目的时候用(代码量较多时)

注意: 在JS中常用的是单引号.

内嵌JS

<!--在网页的head标签中,添加script标签,所有的JS代码都放在Script标签中.-->
<head>
  <script>
    alert('Hello  World~!');
  </script>
</head>

外链JS

<script src="outdoor.js"></script>
注意:外链和内嵌不能混合使用

**注意：**引用外部 js 文件的 script 标签中不可以写代码

行内JS

<input type="button" value="点我试试" onclick="alert('Hello World')" />
可以在行内标签上添加事件操作.

JS中的常见3中打印输出

// 1. 弹出警示框  alert 警示 警惕  实际开发不太常用 用户体验不好  经常用来检测结果
   alert('迪丽热巴');
// 2. 控制台打印 输出  console   控制台    log 日志  经常内部测试用的 程序猿看的
    console.log('古丽扎娜');
// 3. 提示用户输入框  prompt 提示 
   prompt('请输入您喜欢的明星:');

变量的基本写法

在JS中,变量就是使用var标识的内容.   
变量的作用:用来存储数据,这样可以多次使用.
	var user="张三";
	console.log(user+"来了")
	console.log(user+"走了")	

1.JS中见到var 就知道是一个变量,后面跟上一个自己取的名字 例如age
	var age;   //这就声明了一个变量
	age =10;  //将数字10存储到age这个变量中
	//那么 age以后就可以代表10来使用.

2.工作中的常见用法是: 声明+赋值, 一起完成
	var age=10;

3.变量的其他写法
	//同时声明多个变量
    var age, name, sex;  // 等价于   var  age;  var name; vae sex;
    age = 10;
    name = 'zs';
    sex = 2;

    //同时声明多个变量并赋值
    var age = 10, name = ..,sex = 2;
//变量的命名规范
1.字母,数字,下划线,美元符号($)的组合
2.区分大小写
3.不能数字开头
4.不能是中文
5.不能是关键字,保留字,代码符号(var、for、while、name)

建议使用驼峰命名法:  多个单词组合,第一个单词都小写,后面每个单词的首字母大写.
	userName getName  getSum

常见的数据类型

数据类型是将现实生活中的数据,用计算机存储起来. -----js能直接认识这些数据
数值类型  对应现实生活中的数字
字符串类型 对应现实生活中的各种字符
布尔类型  对应现实生活中的 真,假, 正确,错误.
未定义类型  就是计算机不认识的

数值类型

var num = 10;   //num这个变量存的是数字10，那么num就是一个数值类型
同样是数值类型有： 浮点数(也叫小数)
isNaN()  方法，可以判断不是一个数字。

字符串类型

字符串就是字符,包括文字,数字,字母等.
var strMsg = "北京欢迎你";  // 使用 双引号 表示字符串
var strMsg2 = '武汉欢迎你'; // 使用 单引号 表示字符串

布尔类型

布尔类型就两个值: true  false

未定义和Null类型

var usrName; // 声明变量后没有直接赋值，此时它的默认值就是 undefined
alert(usrName); // 显示 undefined
总结: 没有存值的变量,或者没有声明的变量都是undefined

var username = null;  //声明一个变量，但是不知道是谁？先占个座位

其他字符串知识

转义字符

当编程语言中已经使用了一些符号,而我们要表示.需要用转义字符,常见如下表：

字面量

含义

\n

换行符（重要） newline

\ \

斜杠 \

’

单引号 ’

"

双引号 "

\t

Tab

\b

空格 blank

\r

回车符

**注意：** `\n` 和 `\r` 都起到换行的作用，但平时用 `\n` 比较合适。因为 `\n` 是 windows/mac/linux 都支持，`\r` 只有 windows 支持。

2.字符串长度

var strMsg = "我是帅气多金的程序猿！--- 恩，我看出了你的自信。";
alert(strMsg.length); // 显示 26

3.字符串拼接

口诀:数值相加    字符相连    
console.log("hello"+"world");
var user="张三";
console.log("你好"+user+"今天吃了吗?");

数据类型检测

//typeof 可用来获取检测变量的数据类型
var num = 3747;
var isNum = typeof num; // 也可以 写成 typeof(num)
alert(isNum); // "number"

注意: 使用typeof检测null,返回Object类型,是一种历史错误.

注意: 1995年JavaScript语言的第一版，所有值都设计成32位， 其中最低的3位用来表述数据类型，object对应的值是000。 当时，只设计了五种数据类型（对象、整数、浮点数、字符串和布尔值）， 完全没考虑null，只把它当作object的一种特殊值，32位全部为0。这是typeof null返回object的根本原因。

数据类型转换

转换成数值类型

parseInt() ------只能转换开头是数字的字符串 "123abc"
parseFloat() ----只能转换开头是数字,并且能识别第一个小数点.

var num1 = parseInt('12.3abc');  // 返回12，第一个字符是数字会解析知道遇到非数字结束
var num2 = parseInt('abc123');   // 返回NaN，如果第一个字符不是数字或者符号就返回NaN
var num3 = parseInt('100px');    // 100

转换为字符串类型

//toString()  将其他类型转换成字符串
var num = 5;
console.log(num.toString());

转换为布尔类型

Boolean()
0  ''(空字符串) null undefined NaN 等会转换为false
非0 和非空都会转换成 true

隐式转换

显式转换: 就是使用parseInt()  toString()  Boolean() 等进行转换
隐式转换: 就是不使用上面这些转换函数, 自动转换的类型.

 //字符串+任何类型都是字符串----因为进行了隐式转换
    //加号有两个功能: 1.数值相加 2.字符相连
    console.log('20' + 10);

    //如果是减法,乘除,会进行隐式转换,----转换成数值
    console.log('20' - 10);

    //容易出现隐式转换成布尔类型,  比较符号的时候
    console.log(10 > 15);

相关文章