我要评论作者：浪子花梦，一个有趣的程序员 ~
此文将简单的讲解一个编程语言中最基础的东西，如变量、运算符、分支、循环、函数等等 . . .
其他二篇文章如下：
- 超强的入门文章 ！！！ JavaScript 速成计划第二篇（杂项详解：JS操作HTML 与 CSS、异常、事件）!
- 超强的入门文章 ！！！ JavaScript 速成计划第三篇（面向对象与常用的内置对象、DOM对象、浏览器对象）!
文章目录
所有的 JS 代码都是放在如下的标签之中：
废话不多说，直接开干 ！
初步探索变量
变量用关键字 var进行声明，var会自动推断出数据的类型，使用如下所示：
var i = 20.5;
var j = 10;
document.write(i + j + "<br/>");
将 i 与 j 相加，然后输出结果，并且加上换行
结果如下：
除了这浮点型、整形数据外，还有许多其它的数据，如下所示：
var bool = true; // bool 类型
var str = "hello"; // 字符串类型
var arr = [1,2,3,4,5]; // 数组类型
其中，数组的访问和其它语言一样，都是通过下标进行索引，如 arr[0] 等 . . .
运算符
运算符的使用也非常的简单，像一些 +、-、*、/ 之内的运算符这里就不详细的讲了，例如下面的三目运算符：
document.write(1? "Hello":"World!");
效果如下所示：
我们主要来说说 == 与 === 的区别，看看如下的代码：
var i = 20;
var j = "20";
document.write(i == j);
document.write("<br/>");
document.write(i === j);
结果如下所示：
这是为什么呢？ 20 与 “20” 相等吗？ === 又是什么东西？ 当我们使用 == 时，他的底层会使用一种转换，将 “20” 转换成20，然后再进行比较（true)，=== 表示判断相等的同时，也会判断两者的类型是否相等（false） . . .
条件判断
条件判断有两种语法格式，if 与 switch，和其它语言使用方式是一样的，我们看下面这个例子：
var i = 10;
if(i > 10){
document.write("Hello");
}
else{
document.write("World!");
}
switch (i) {
case 10:
document.write("<br/>" + "I Love You" + "<br/>");
break;
default:
document.write("i don't ten !");
break;
}
结果输出如下所示：
循环遍历
循环有三种方式，分别是 while、do while、for，遍历一个集合的方式也有许多种 . . .
首先，我们准备一个数组（用于测试）：
var arr = [9,2,3,4,5];
arr.sort();
//document.write(arr);
while：
var i = 0;
while(i<arr.length){
document.write(arr[i++] + " ");
}
document.write("<br/>");
do while：
i = 0;
do{
document.write(arr[i++] + " ");
}while(i < arr.length);
document.write("<br/>");
for：
for (let index = 0; index < arr.length; index++) {
document.write(arr[index] + " ");
}
document.write("<br/>");
forEach 遍历数据：
arr.forEach(item => {
document.write(item + " ");
});
document.write("<br/>");
forof 遍历数据：
for (const item of arr) {
document.write(item + " ");
}
document.write("<br/>");
forin 遍历数据：
for (const index in arr) { // i 表示 arr的下标索引
document.write(arr[index] + " ");
}
document.write("<br/>");
这几种访问数组元素的结果都是一样的，如下所示：
函数与变量作用域
函数
函数是非常重要的一个方法，合理的使用函数，可以使程序的可读性变的非常的优秀，下面我将介绍几种不同的使用方式 . . .
无参函数：
function sum(){
alert("Hello, World!"); // alert的作用是弹出一个警示框
}
sum();
效果如下所示：
有参函数：
function showinfo(m, n){
document.write(m + " " + n + "<br/>");
}
showinfo("huameng", 20);
showinfo("langzihuameng", 30);
showinfo(25, 0);
效果如下所示：
有返回的方法：
<p id="pid">Hello, World!</p>
<script>
function alterdata(){
return "Hello, langzihuameng";
}
function sayhello(){
document.getElementById("pid").innerText = alterdata();
}
</script>
<button onclick="sayhello()">Alter Data</button>
当我们点击按钮时，对改变 p元素中的内容，其中有几个方法大家可能不知道，没关系，我会在后面的文章中进行详细的讲解，innerText 属性表示的是 标签的内容，我们只是将函数的返回内容将原本已经有的内容进行一个覆盖而已 . . .
.
变量作用域
说起变量的作用域，我们就容易的想到 局部变量与全局变量，那么 在JS中我们是怎么使用的呢？
代码如下所示：
var i = 20; // 全局变量
function func(){
var k = 10; // 局部变量
num = 250; // 全局还是局部呢？
document.write(i + "<br/>"); // 20
document.write(k + "<br/>"); // 10
document.write(num + "<br/>"); // 250
}
func();
document.write(num + "<br/>"); // 250 全局变量 能够被访问到
代码中，哪些是局部变量，哪些是全局变量，我已经说明清楚了，特别注意的是 num = 250；这一句代码，它是全局变量 . . .
.
.
.
本文地址：https://blog.csdn.net/weixin_42100963/article/details/107339433
您可能感兴趣的文章:
如您对本文有疑问或者有任何想说的，请点击进行留言回复，万千网友为您解惑！
网友评论