August 17-day 27 JS基础知识

什么是JS

1. js是javaScript的缩写，是一门脚本语言。专门用来负责网页上的行为（可以直接写到网页中）

2. 在哪儿写js代码
   a.可以写在script标签中（理论上script标签可以放到html文件中的任何位置）
   b.写到标签的事情属性中（例如：onclick）
   c.写到外部的js文件中（.js）

3. js在网页中能做什么事情
   a.在网页的不同的位置插入html代码
   b.修改某个标签的内容
   c.修改标签的样式

    
        
        
        
        
        
        
        
    
    
    
        
千峰的所有学科
        
        
        修改颜色    
            
        
        修改内容
        
        
    

JS基础语法

1. js中的注释
   //这是单行注释
   /*
   这是多行注释
   */

2. 语句
   一条语句结束需要加分号(现在的js版本也可以不用写)
   一行写多条语句必须使用分号隔开

3. js没有缩进问题，用｛｝表示一个块

4. 基本数据类型
   /*
   Number（数字）、String（字符串）、Boolean（布尔）、Array（数组 等于列表）、object（对象 等于字典）
   function（函数）、null、undefined
   */

在控制台中打印括号的内容，功能和python中print
console.log('hello javsscript');
console.log('你好，python');

5. 字面量

• 数字字面量
  89;
  1.2;
  3e8;
• 字符串字面量
  'abc';
  "abc";
• 布尔字面量
  true;
  false;
• 数组字面量
  [1,1,'asd',12,3,3,54,654,,654,5];
  [];
• 对象字面量（对象的key值又是属性，不用加引号）
  var dict= {a:"asd",asd:"sss"};
  console.log(dict['a'], dict.b)

6. 标识符
   使用标识符来命名

• a.由字母、数字、_和$组成，数字不能开头
  var s8uu_$;
• b.不能关键字
  var for
• c.大小写敏感，y和Y不一样
• d.规范：1.见名知义

变量的声明

• js中可以通过声明变量来保存数据

1. 语法
   var 变量名
   var 变量名 = 初值
   说明： var是关键字；
   变量名：标识符，不能随意使用_或者$开头；驼峰式命名规则（第一个单词首字母小写，后面每个单词的首字母大写）

var userName;
userName = 'w阿萨德';
console.log(userName);

var score = 100;
console.log(score);

//同时声明多个变量名

var nam = '谁说的', age = 45, sex = 'woman';
console.log(nam)

//一个变量可以存储任意类型的值；声明变量的时候，变量没有赋值，默认是undefined
var a = 'abac';
a = 100

运算符

1. 数学运算符：+，-，*，/，%，++，--
2. 比较运算符：>,<,==,!=,>=,<=, ===,!==,<==,>==
   -符号‘==’即使是变量里面的内容与之相等，也就是说与类型无关
   -符号‘===’要让内容以及类型相等
3. 逻辑运算符：&&（与），||（或），！（非）
4. 赋值运算符： =， +=， -=， *=， /=，%=
5. 三目运算符 :条件语句 ？ 值1 ： 值2
   判断条件语句的结果是否是true，如果是true，那么表达式的结果就是值1，否则是值2

分之结构

• js中的分之结构有两种：if语句，switch语句

1. if语句

• a.if（条件语句）｛满足条件要执行的代码块｝

var age = 18
if(age>=18){
    console.log('成年')
}

• b. if(条件)｛语句块1｝else｛语句块2｝

if(age>=18){
    console.log('成年')
}else{
    console.log('未成年')
}

• c.if - else if - else（相当于python中的if-elif-else）

if(age<18){
    console.log('未成年')
}else if(age<40){
    console.log('青年')
}else{
    console.log('老年')
}

2. switch语句
   switch（变量）｛
   case值1：
   语句1;
   break
   case值2：
   语句2;
   break
   case值3：
   语句3;
   break
   ...
   default:
   语句4；
   break
   ｝

执行过程：使用变量的值一次和后边每个case后面的值进行判断，看是否相等。
如果相等就执行那个case后面对应的语句，如果前面每个case后面的值都和变量的值不相等，就执行default后边的语句

var score = 10;
switch(score){
    case 1:
        console.log('F')
        break;
    case 10:
        console.log('D')
        break
    case 4:
        console.log('A+')
        break
    default:
        console.log('其他')
        break;
}
console.log('====')

练习：10分制分数：0-5：不及格，6-7及格，8-9：良好 10：优秀

switch(score){
    case 0:
    case 1:
    case 2:
    case 3:
    case 4:
    case 5:
        console.log('不及格');
        break;
    case 6:
    case 7:
        console.log('及格');
        break;
    case 8:
    case 9:
        console.log('良好');
        break;
    case 10:
        console.log('优秀');
        break;
}

循环结构

• js中的循环分为for循环和while循环

1. for循环

• a.for- in （和python中的for循环效果一样）

var ss = [1,2,'asd']
var x
for (x in ss){
   console.log(ss[x])
}
var obj1 = {name:'张三', age:30}
for (var key in obj1){
   console.log(key, obj1[key])
}

• b.for(表达式1；表达式2；表达式3)｛循环体｝
  执行过程：先执行表达式1，然后再判断表达式2的结果是否是true，如果是true就执行循环体；执行完循环体，再执行表达式3；
  执行完表达式3，再判断表达式2的结果是否为true，如果是true又执行循环题；执行完循环体，在执行表达式3；一次

var sum1 = 0
var i
for(i=1;i<101;i++){
    sum1 += i 
}
console.log(sum1)

2. while循环

• a.while（条件语句）｛循环体｝ -- 和python一样

var sum2 = 0
var i=1
while(i<=100){
    sum2 += i ;
    i++;
}
console.log(sum2)

• b.do-while循环： do｛循环体｝while（条件语句）；
  执行过程，先执行循环体，然后判断条件是否成立。如果成立再执行循环体。。。
  依次类推，直到条件不成立，循环结束

var sum2 = 0
var i= 1
do{
    sum2 += i;
    i++;    
}while(i<=100);
console.log(sum2)

3. break和continue（和python一样）
   break：直接跳出循环体
   continue：直接进行下一次循环

函数

1. 函数的声明
   function 函数名（参数列表）｛函数体｝
   function - 关键字
   函数名 - 驼峰式：见名知义
   参数：阿萨德

function sum1(num2, num1){   //由于版本原因在设置参数时最好不赋初值，会报错
    console.log('求两个书的和')
    return num1 + num2
}
console.log(sum1(10,20))
//console.log(sum1(20))

//函数没有return的时候，函数的返回值是undefined
function func1(){
    console.log('我是函数1')
}
console.log(func1())

2. 函数的调用
   函数名(实参列表)
   调用过程和python一样

3. 作用域
   全局变量：声明在函数外面的变量（从变量声明到文件结束）
   局部变量：声明在函数里面的变量，（从变量声明到函数结束；函数的参数也是局部变量）

aaa就是全局变量
var aaa = 10

function func2(){
    //bbb就是局部变量
    var bbb = 100
    console.log(bbb, aaa)
    //函数中可以修改全局变量
    aaa = 200
    
    //函数中可以声明函数
    function func22(){
        bbb = 1.1
        console.log(bbb)
    }
}
func2()
console.log(aaa)

//可以将函数作为变量
var a = func2
a()
//个数不定参数，js不支持

数据类型

• 数字、字符串、布尔、列表、对象

1. 数字：包含整数和小数(支持科学计数法)

var num1 = 10
var num2 = new Number()
console.log(num2+10)

2. 字符串

• a.''和""括起来的字符集
• b.转义字符（和python一样）
• c.字符编码是Unicode编码

var str1 = 'abc'
var str2 = "aasc"
var str3 = '\n'
var str4 = '\\'

• e.获取字符串的长度：字符串.length
  console.log(str1.length)

• f.获取单个字符：字符串[下标]
  下标：1.范围是0~长度-1

2. 如果越界，不报错，但是结果是undefined

js中的字符串不能切片
console.log(str1[0])

• g.运算符
  js中字符串只支持+，不支持*
  字符串1 + 字符串2 --- 拼接两个字符串

js中字符串可以和其他任何数据进行加操作，其效果都是字符串连接（会将其他数据转换成字符串）

console.log('123'+'abc', 100+'sss')

• h.字符串相关方法（查）

var str23 = 'asd456'
var re = str23.replace(/\d+/,'fff')
console.log(re)

3. 对象， 构造方法（类）

var obj1 = {name:'asd', asd:88}
console.log(obj1['name'], obj1.name)

function Person(){
    this.name = 'abc'
    this.age = 18
    this.sex = '女'
}
var p1 = new Person()
p1.name = 'mmm'
p1.age = 20
console.log(p1,typeof(p1))