美文网首页
js基础知识点总结

js基础知识点总结

作者: sugar_sugar_ya | 来源:发表于2020-02-21 21:59 被阅读0次

转义字符

' 普通单引号

栗子:

var str = '"tsy" love U, \'dan\'';

" 普通双引号

栗子:

 var str = "\"tsy\" love U, 'dan'";

\n 换行

栗子:

console.log("abc\ndefg");// abc  // defg

操作运算符

算术运算符

  • % 表示取余
    栗子:
  • console.log(12 % 10); //2
  • +号有拼接 和 运算两个功能,如果两边都是数字才运算
    栗子:
    console.log(10 + "10"); //1010
    //+号两边只要有字符串,就是拼接功能
    console.log(10 + 10); //20
    //+号两边都是数字才是运算功能
  • -*/%号只有运算功能,不管两边是不是数字,都是运算功能
    栗子:
    console.log(10 - '10'); //0
    console.log(10 * 10); //100
    console.log(10 / 10); //1
    console.log(12 % 9); //3

赋值运算符

在编程语言中,=表示赋值,(== === 才是用来判断是否相等的)

  • += 先加再赋值
    num += 10 可以写成 num = num + 10
  • -=先减再赋值
    num -= 10 可以写成 num = num - 10

一元运算符

一元运算符又叫自增、自减运算符

自增:让变量的值在原来的基础上+1

(1) ++age 前自增 先让这个值+1,再返回这个值

var age = 18;
++age;
console.log(age); //11

(2) age++ 后自增 先返回这个值,再让这个值+1

var age = 18;
age++;
console.log(age); //11

不管是前自增,还是后自增,都是让值+1

区别:++age 和 age++ 这个式子的结果是不一样的

var age = 18;
var result = age++;
console.log(result); //18
console.log(age); //19

var age = 18;
var result = ++age;
console.log(result); //19
console.log(age); //19

逻辑运算符

逻辑运算有三种:&& || !

  • && 并且 两边同时满足时,才为真

注意点:&&从左往有取第一个为假的值,返回这个假值;如果没有假值,就取最后一个为真的值(不取布尔值)

栗子:

console.log(0 && undefined && "0"); //0

console.log(true && 456 && "0"); //'0'
  • || 或者 两边只要有一个满足,就为真

注意点:||从左往后取第一个为真的值,最后一个为假的值(不取布尔值)

栗子:

console.log('hello' || 456 || "0");

console.log('' || 23 || ""); //23
  • ! 取反

栗子:

console.log(!123); //false

比较运算符

有> < >= <= == != === !==

栗子:

console.log(true > 2); //false

console.log(true >= 1); //true

console.log(123 == '123'); //true 只看数值不看类型

console.log(123 === '123'); //false 同时看类型和数值

console.log(123 != '123'); //false

console.log(123 !== '123'); //true 判断值或者类型是否不等, 只要有一个不相等, 就是不等

运算符优先级

优先级的高低排列:

  1. 括号的优先级最高
  2. 一元运算符 ++ -- !
  3. 算数运算符 先乘除% 后 + -
  4. 比较运算符 > < >=
  5. 逻辑运算符 && || && > ||
  6. 三元表达式
  7. 赋值运算符

类型转换

转换成数字类型的方法

(1) Number()

栗子:

var str = '66';
console.log(Number(str)); //66

(2) parseInt()

栗子:

var str = parseInt('88ab');
// parseInt 从第一个字符开始解析,解析到第一个非数字时,解析结束
console.log(str); //88

var str = parseInt('88.88');
// parseInt 从第一个字符开始解析,解析到第一个非数字时,解析结束
console.log(str); //88

(3) parentFloat()

栗子:

var str = parseFloat('88.8878');
console.log(str); //88.8878

var str = parseFloat('88.8878.66');
// parseFloat 从一个字符开始解析,只解析第一个小数点,再往后遇到第一个非数字或者第二个小数点时解析停止
console.log(str); //88.8878

(4) 直接运算 - / * % 正号 符号

栗子:

var a = '100';
console.log(a - 0); //100

var b = '100';
console.log(b * 1); //100

var c = '50';
console.log(c / 1); //50

var d = '200';
// 把字符串变成数字类型直接取正,这种方式推荐
console.log(+d); //200

var d = '300';
console.log(-d); //-300

console.log('true' - 0); //NaN

转换成string类型

(1) String()

栗子:

var num = 10;
console.log(String(num));

(2) xx.toString()

栗子:

var num = 10;
console.log(num.toString()); //'10'

(3) 拼串

栗子:

var num = 20;
// 拼串最为常见 变量 + ""
console.log(num + ''); //'20'

转换成Boolean布尔类型

六个转化为boolean布尔类型报错的值有:""、null、undefined、NaN、0、false

(1) Boolean()

栗子:

console.log(0); //0
// 数字0转化为布尔类型时,值为false
console.log(Boolean(0)); //false

console.log(""); //空字符串
console.log(Boolean("")); //false

(2) !!a

栗子:

var a = 'hello'
console.log(!!a); //true

流程控制

if 语句

使用:用来判断范围,使用if...else...更方便

模板:

if (条件 1){
    //当条件 1 为 true 时执行的代码
} 
else if (条件 2) {
    //当条件 2 为 true 时执行的代码
} 
else {
    //当条件 1 和 条件 2 都不为 true 时执行的代码
}

三元表达式

使用:用于简单的判断

用法1:
var 结果 = 判断条件 ? 值1 : 值2 
如果判断条件为true, 结果就是值1, 如果为false, 结果就是 值2

switch...case 语句

switch..case适用于具体的值的判断

语法格式:

switch (变量) {
    case 值1:
        语句1;
        break;
    case 值2:
        语句2;
        break;
    case 值3:
        语句3;
        break;
    ......
    default:
        默认语句;
}

栗子:

var score = prompt("请输入您的成绩");
score = score / 10;
switch (score) {
   case 10:
      console.log("A");
      break;
   case 9:
      console.log("A");
      break;
   case 8:
      console.log("B");
      break;
   case 7:
      console.log("C");
      break;
   case 6:
      console.log("D");
      break;
   default:
      console.log("还需要继续努力哦!");
    }

注意点:

  • break可以省略,如果省略,代码会继续执行下一个case
  • switch 语句在比较值时使用的是全等操作符, 因此不会发生类型转换(例如,字符串'10' 不等于数值 10)

回调函数

把函数当成参数进行传递,这个当成参数进行传递的函数,就是回调函数

var result = [], n, i;
|| 两个表达式等价
var result = []
var n;
var i

this指向易错点:

arguments[0]()调用某个函数时,this指向arguments

obj['get']()调用get函数时,this指向obj
var p = 123;
(function () {
    console.log(p) //123
})()

静态成员和实例成员

静态成员:属性和方法直接给构造函数添加
写法: 构造函数.成员

实例成员:属性和方法直接给实例添加的(原型上的成员也是实例成员)
写法: 实例.成员

位运算符

使用场景: 取整

原理: 位运算符会丢掉小数部分

console.log(6.8 | 0) ===> 111 | 000 

![] == [] ==> false == [] ==> 0 == 0 true

相关文章

网友评论

      本文标题:js基础知识点总结

      本文链接:https://www.haomeiwen.com/subject/tblcqhtx.html