JS基础(一)

javascript

一、 前言

  1. JS 是一个脚本语言
  2. JS是web的编辑语言
  3. 经常理解为 html-结构、css-样式、js-行为
  4. js可以写html、也可以写css、但是主要是用来渲染页面,负责页面和数据之间的传递和显示,以及编辑功能....

二、JS基础

1.使用

和css差不多,js有两种使用方式
1.内部js
在html的底部






2.外部引入

2.输出

1.弹框 alert
内部js

2.外部js里面直接写代码
alert('哈哈哈');

3.写到html上 document.write
床前明月光
疑是地上霜 4.innerHTML写到html内里面可以写html的标签,显示的时候显示的是标签内的东西。 innerText写到标签里面,如下所示会显示包含标签的一块 app我们称为节点,通过节点然后把内容写到该节点的地方 Document
两行白鹭上青天

<span class="border: 1px solid">两行白鹭上青天</span>

5.写到控制台 浏览器F12调出控制台console console.log('今天天气很好');
  1. 变量
1.变量
变量一个可变的量,用来储存数据
声明一个变量用var
var 变量名;
var num; 这个时候num是个变量
变量赋值 = 赋值符号      num = 1;     这个时候num等于1
2.关键字
一些语言以及规定意义的词比如function
3.标识符
js严格区分大小写
命名规范: 
  字母 $ _ 开头
  第一个单词小写,后面的单词第一个字母必须大写

4.小总结

一、变量
    * 变量是什么,有什么用
    * 声明变量
    * 赋值
二、js一些语法和概念
    1. 区分大小写(html不区分大小写)
    2. 标识符(比如变量名称等)
        * 以字母、下划线、$开头
        * 其他字符可以是字母、下划线、$或数字
        * 驼峰式:小写字母开头,第二个打次首字母大写
    3. 注释
        * 单行注释
        * 多行注释
    4. 关键字和保留字
        * 关键字:系统在使用
        * 保留字:系统将来可能用到
        * 不能作为标识符来使用
        * 用来作标识符就会报错
三、变量有哪些类型
    1. 数字 Number类型
        * 整数
        * 小数
        * 最大值和最小值
        * NAN
    2. typeof 判断变量的类型
    3. String类型 字符串
    4. Boolean类型 true和false
    5. Undifined类型 undefined
        * 用来表示声明了变量但未初始化(赋值)
    6. Object类型
        * 普通对象(无序集合)
        * 数组(特殊对象)
    7. Null类型 null
        * 声明一个变量准备用来存储对象
四、变量的类型判断
    * 基本数据类型(简单数据类型) Undefined、Null、Boolean、Number和String
    * 引用数据类型(复杂数据类型) object,array他们的属性或者成员可以包含简单数据类型

5.数据类型

5个基本数据类型
1.数组类型 Number
  数字   NaN
2.字符串类型 String 
  ' ' 或 'saf'
3.布尔类型 Boolean
  true 或 false
4.undefinde 未定义
5.null 空

2个引用数据类型
1..数组类型Array
  var 数组名 = [ ]
  var 数组名 = [数组值]
  var 数组名 = [  {object}]
2..对象类型Object
  var 对象名 = { }
  var 对象名 = new object
  var 对象名 = {    属性(变量名)=值(各种类型) }
  NULL和Array的数据类型都是Object

6.运算符

和数学的运算符一致
加 +
减 -
乘 *
除 / 
取余 %

7.关系运算

1.if判断语句
  if(条件语句 (变量或运算)){执行代码}else{执行语句}
如果满足就干嘛,否者就干嘛
if(!null){return:"哈"}else{return:"切"}
如果不是空就返回 哈,否者返回 切

2.赋值运算符和逗号运算符
赋值运算符 =  用于给变量赋值
复合运算符:
  +=    a += 10;    =>   a=a+10
  -=    a -= 2 ;    =>   a=a-2
  *=    a *= 5;     =>   a=a*5
  /=    a /= 3      =>    a=a/3
逗号运算符 , 用于简洁声明变量
var a,b = 10 ;  声明a,b变量并赋值10

3.一元运算
自加运算符 ++
  ++i 先自加1再参与计算
   i++ 先参与计算再自加1
负号运算符 - 
  直接给变量取负值
自减运算符 --
  --i 先自减1再参与计算
  i-- 先参与计算再自减1

4.逻辑运算
逻辑非 !
  取相反的值 先用布尔进行判断,会涉及类型转换,隐式和显式转换
逻辑与&&
  布尔类型情况下 只要有一个false就不会检查后面的,结果就是false
  非布尔情况下  判断第一个变量的值(先进行隐式布尔转换)若第一个为true取后面false的变量值,若第一个为false取第一个变量的值
  实际应用里的小技巧
  // 下面用这个特性来检测这个变量有没有值和属性
    var cat = false;
    console.log(cat && cat.name);
逻辑或 ||
  布尔情况下,条件里满足一个就为true,都不满足为false
  非布尔情况下,在条件里找true,值都取第一个为true的值,若没有true则取最后一个的值
  // 小技巧,用于不确定有没有给值,先设置一个默认值
    var date;
    var dater = date || '2019-2-15';
    console.log(dater);
扩展 多个运算在一起的情况下
  /**
        在下列的算式里,看似很复杂,实际上可以分成两大部分||左右进行判断,
        如果前者为false再算后面的,
        而后面的关系运算符==也可以分成左右两边进行计算
        得出结论,计算优先级之前得看清全盘,最后关键是赋值运算那
        */
        // 计算优先级:()=> 自加减 => 算术运算 => 关系运算(比较运算)=> 逻辑运算=> 赋值运算;
        var sum = 20 + i++ + 'abc' || 123 - ++i + ++j + ++j + '123' == 123 * 2 / 4 ;

5.类型转换
隐式转换
  在条件语句为一个变量时出现
  先把变量转换为布尔类型,true执行else之前的,false执行else之后的
  空、0、undefinde、NaN,各类数据类型意义上为无的都为false,否者就为true
显式转换
  判断变量的类型       typeof 变量名
  Number(变量名);   除了数字和空以及布尔其他全为NaN
  Boolean(变量名);      !!Boolean(变量名) 空、0、undefinde、NaN,各类数据类型意义上为无的都为false,否者就为true
  String(变量名);   全部加上引号变成字符串然后(+)连接起来 
  Object(变量名);基本不进行转换因为对象可以把所有类型都包含

你可能感兴趣的:(JS基础(一))