JS学习指南(1)

Node.js可以在命令行、服务端运行Js。
Chrome则运行在浏览器。
VScode是比较轻的一个编辑器。

1.在node使用

创建文件 demo1.js
输入内容 (不怎么需要HTML基础)
命令行到该目录 (如果不会命令行可以去看cmd命令)
node demo 或 node ./demo.js

2.在浏览器使用

创建文件 demo.html demo.js
输入内容(这里可能需要HTML基础)

<!DOCTYPE html>
<html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <-- 在script标签引入 src属性写地址--> <script src="./demo.js"></script> <-- 也可以在script标签写--> <script> //内容 </script> </body> </html>

一、输出

console.log("Hello World!"); //输出在控制台 alert('Hello World!'); //输出弹窗 document.write("Hello World!"); //输出在网页

因为Node没有dom和bom所以alert和document不能在Node运行

console 在F12控制台可以查看
alert 在浏览器中会弹窗
输出的字符需要使用双引号、单引号还有反引号括起来
数值则不用

这里字符串和数值就属于数据类型

二、变量

var box = 10; //数值 let box = "String"; //字符串 const box = true; //布尔值

数值就是数字，可以包含整数、小数、二进制、八进制等数值
字符串就是字符、文本，其中字符需要使用括号引起来
布尔值的意思就是真(true)或假(false) 其中数值的0 和空字符串为false

这里的var let const可能有些看不懂，其实意思就是声明变量，在Js里面有一个东西叫做作用域。
var 是函数级作用域并且可以重复声明
let 是块级作用域不能重复声明
const 是块级作用域不能重复声明不能进行运算
这里有一点需要注意就是 let 和 const 不支持老浏览器，
但是可以使用babel转化成为ES5(因为这是ES6新版本)。

三、运算符

1+1    //2 数值相加  1+"1" //11 数值和字符串相加 1-1 //0 数值相减 1*1 //1 数值相乘 1/1 //1 数值相除 1%1 //数值取余 box = 1 //赋值 box += 10 //加并赋值(box = box-10)，还有-=、*=...

四、函数
函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。
函数也是变量的一种

function main(){     //声明函数 //函数里面的内容 console.log("调用函数"); } var main = function(){ //变量式声明函数 //函数里面的内容 console.log("调用函数"); } var main = ()=>{ //箭头函数 //函数内容 } /*同时函数有传参数功能*/ function main(num1, num2){ //打印传进来的两个参的和 console.log(num1 + num2); } /*返回值*/ function sum(num1, num2){ return num1+num2; } var a = 10; //返回值a为10 var b = a; //把a赋值给b var c = sum(5,5); //把sum函数赋值给c c等于10

五、数组和对象
数组和变量也是变量的一种。
数组就是一些数据类型的集合。

//数组
var array = [123,"String",true]; console.log(array[0]); //数组的调用 数组是从0开始数 //对象 var Obj = { name: 'Jack', age: '35', getName: function(){ //对象里的函数写法1 //这里的this指向的就是Obj 即对象本身 return this.name; }, getAge(){ //对象里的函数写法2 ES6写法 return this.age; }, setName(name){ //设置名字 this.name = name; } }; console.log(Obj.name); //Jack console.log(Obj.age); //35 console.log(Obj.getAge); //35 Obj.setName('Tom'); //Obj的name变成了Tom console.log(Obj.getName()); //Tom

在Js里面每一个变量都是对象

比如字符串:

console.log("Hello World".search("W")); //6 W在字符串里是第6位

比如数组

[123, "String", true].map(function(item){ console.log(item); //123 //String //true }); //遍历数组 console.log([123, "String", true].length); //3 数组长度

还有很多这样的对象没有一一列举

六、循环语句、条件语句

1.if语句
条件语句用于基于不同的条件来执行不同的动作。

/*
一个花括号就是一个块 {}
如果没有使用块 只能执行一行
*/

//能执行一块
if(true){ //条件 需要为true 例如非0 或者非空字符串 //括号里的参数是true的情况下就执行 console.log("这是true的"); }else{ //括号里的参数是false的情况下就执行 console.log("这是false的"); } if(true) console.log("True"); //只能执行一行

2.switch语句
switch 语句用于基于不同的条件来执行不同的动作。

/*
switch(变量){
    case 变量的值:
        //内容
    break;    //中断
    default:    //如果没有值相同
}
*/
var a = 10; switch(a){ case 10: console.log("a的值是" + a); break; //中断 default: //如果没有值相同 console.log("a的值是" + a); break; }

3.for语句
循环可以将代码块执行指定的次数。

//for语句 for(先执行的; 执行条件; 语句执行后执行的)
for(let i = 0; i < 10; i++){ console.log("for语句"); //打印十次 } console.log(i); //报错 上面let 是在一个块级 出了{}以后就不能获取 for(i in [1,2,3]){ //遍历值赋给i 随后打印i console.log(i); //1 2 3 }

4.while
只要指定条件为 true，循环就可以一直执行代码块。
这个方法要主要不要写成死循环

/*
while(true){    //条件
    //内容
}
do{
    //内容
}while(true)    //条件
*/

do...while是先运行一遍然后判断条件如果成立就再执行

var i = 0; while(i < 5){ console.log("while"); //循环5次 i++; } do{ console.log("do...while"); i++; }while(i < 5) //条件

作者：INS_null
链接：https://www.imooc.com/article/24662?block_id=tuijian_wz
来源：慕课网

猜你喜欢