JavaScript-day01

玛卡巴卡21
65 阅读4分钟

一、JavaScript：

简称js，是一个运行在浏览器端的解释型、弱类型、面向对象的脚本语言。

浏览器端：环境，自带js解释器，打开浏览器可以自动运行，以后也会安装一个独立的js解释器。
解释型：在程序运行之前，不需要检查语法是否正确，直接运行，碰到错误就停止。
编译型：在程序运行之前，需要先检查语法是否正确，如果不正确，直接不运行。
弱类型：变量保存的数据可以是任意的，数据类型由数据来决定。
强类型：变量保存的数据，由数据类型来决定。
面向对象：对象名.属性名;对象名.方法名();

二、JavaScript的特点：

  • 可以使用一切编辑工具编辑代码；
  • 解释型
  • 弱类型
  • 面向对象
  • 可以做一切css完成不了的效果（轮播、选项卡、购物车、验证...）

三、引入：

  • 在html页面上书写一个script标签，在里面书写代码
<script>
   //js代码
</script>
  • 创建一个.js文件，再在html中进行引入
<script src="xx.js">
    //这里面不能写代码
</script>

四、输出方式/打桩输出：

  • 在控制台输出日志：console.log(想要输出的东西)，不会影响到页面
  • 在页面输出日志：document.write(想要输出的东西),如果搭配上点击事件会把页面的所以东西替换掉
  • 在弹出框输出日志：alert(想要输出的东西),有时候会卡住整个页面，导致用户只能看见一个白板

五、变量：

创建后可以再次修改

语法：var 变量名 = 值
变量名不是随意的：

  • 不能以数字开头
  • 建议驼峰命名法或下划线命名法
  • 命名要尽量见名知意
  • 如果变量名是name，不管你保存的数据类型是什么，都会悄悄给你转成字符串
  • 变量名不能是关键字
  • 声明变量不赋值结果为undefined
  • 同时创建多个变量：var 变量名 = 值,变量名 = 值;

六、常量：

创建后，不允许在修改了，其余特点和变量一样

语法：const 常量名 = 值

七、数据类型分类：

  • 原始/基本/值数据类型：
    1. number：数字，NaN，颜色为蓝色
    2. string：字符串，必须加上""或者'',颜色为黑色
    3. Boolean：布尔，取值只有true和false，颜色为蓝色
    4. null：空，取值只有一个就是null，作用是释放变量释放内存，节约内存空间，提升网页的性能，颜色是灰色
    5. undefined：只有一个取值就是undefined，颜色为灰色
  • 引用/对象数据类型:11个对象
    查看数据类型：typeOf(变量)

八、运算符：

  • 算术运算符：+、-、*、/、%(取余)
    1. 算术运算符带有隐式转换，默认会把左右两边转为数字在计算
    2. true-->1
    3. false-->0
    4. undefined-->NaN
    5. null-->0
    6. "100"-->100
    7. "100px"-->NaN
    8. NaN:Not a Number，不是一个数字，但是它确实是数字类型，有两个缺点：
      a. 参与任何的算术运算结果均为NaN
      b. 参与任何的比较运算结果都为false
    9. +运算符号如果碰上了字符串，左右两边都会悄悄的转为字符串，然后拼接
  • 比较运算符：>、<、>=、<=、==、!=、===（值和数据类型都要相同）、!==
    1. 结果：一定是个布尔值
    2. 带有隐式转换：默认左右两边都会悄悄转为数字再比较大小
    3. 如果参与比较的左右两边都是一个字符串，则会按位PK每个字符的十六进制的unicode号（十进制ASCII码），数字0-9<大写A-Z<小写a-z<汉字。常识：汉字的第一个字：是 一 unicode号是 4e00 ascii是19968，汉字的最后一个字：是 龥 unicode号是 9fa5 ascii是40869
    4. NaN参与任何的比较运算结果都是false，isNaN()在接收到一个值之后，会尝试将这个值转换为数值，如果能成功转换则返回false，否则返回true；判断是否为NaN的方法：isNaN(x)
    console.log(isNaN("fe"));//true
console.log(isNaN(1));//false
console.log(isNaN(true));//false
console.log(isNaN(false));//false
console.log(isNaN(null));//false
console.log(isNaN(undefined));//true
console.log(isNaN(" "));//false
    1. undefined==null结果为true，但是undefined===null结果为false
    2. ===和!==都不带隐式类型转换，要求值和数据类型均相同
  • 赋值运算符：=、+=、-=、*=、/=、%=
    1. =：赋值：将=右边的东西，保存到=左边的变量名之中
    2. i=i+1 ==> i+=1
  • 逻辑运算符：&&（与）、||（或）、!（非）
    1. &&：与（并且），全部条件都满足，结果才为true，只要一个不满足，结果就为false
    2. ||：或，全部条件都不满足，结果才为false，只要一个满足，结果就为true
    3. !：颠倒布尔值
  • 自增自减运算符：++、--
    1. 自增：固定的每次只能+1
    2. 前++：先+1，再返回值
    3. 后++：先返回原值，再+1
    var a = 2;
var result = a++ + a++ + ++a + a++ + ++a + ++a;
// 	      2     3     5     5     7     8
console.log(result);//30
  • 位运算：
    1. 左移：m<<n,读作m左移了n位，翻译：m*2的n次方
    2. 右移：m>>n，读作m右移了n位，翻译：m/2的n次方
    3. 底数只能是2

九、用户输入框：

var 变量=prompt("提示文字");
avatar
文章
阅读
粉丝