JavaScript笔记之一：JS原生

JavaScript

一、基础

运行在客户端的脚本语言

脚本语言：不需要编译，运行过程中由 js解释器（js引擎）逐行来解释执行

也可以基于 Node.js 技术进行服务器端编程

1. 作用

• 表单动态验证
• 网页特效
• 服务端开发 Node.js
• 桌面程序 Electron
• App
• 物联网
• 游戏开发

2. 浏览器执行JS

浏览器分为两部分：渲染引擎 、JS引擎

• 渲染引擎：用来解释HTML和CSS，内核
• JS引擎：JS解释器，读取网页中的 JS 代码，处理后运行

浏览器本身不会执行JS代码，而是通过内置JS引擎来执行JS代码。JS引擎执行代码时逐行解释每一句代码（转换为机器语言），然后由计算机去执行，所以JS语言属于脚本语言。

3. JS的组成

第一个是基础，后两个是API

4. 输入输出

方法	说明	归属
alert(msg)	浏览器弹出框，展示给用户	浏览器
console.log(msg)	浏览器控制台打印输出，给程序员测试用	浏览器
innerHTML	写入HTML元素 配合id用
prompt(info)	浏览器弹出输入框	浏览器

二、数据类型

JS的数据类型：通过 typeof 来检测，得到的数据类型有（ES6新加入了Symbol数据类型）

• String
• number
• boolean
• null
• undefined
• Object

上面是 typeof 得到的输出的所有结果

Object是一切数据的基础；

ECMAScript中有5种简单的数据类型，也称为基本数据类型；

String、number、boolean、null、undefined

object 本质是由一组无序的键值对组成的；

1. typeof 操作符

typeof + 变量

console.log(typeof qqqq);	//undefined，这个变量没有定义,但是不会报错；qqqq此时是变量；
console.log(typeof (222));	//number，是一个数字； typeof是操作符而不是方法，所以后面可以加()也可以不加；
console.log(typeof "222");	//string，是一个字符串
console.log(typeof false);	//boolean，是一个布尔值
console.log(typeof {
   });		//object 是一个对象
console.log(typeof null);	//objecy 是一个对象，在javascript里，null是一个空指针；
console.log(typeof function(){
   });	//function，是一个方法,是“可调用对象”，也是属于object类型的；js里万物皆对象

typeof null 这个结果一定要记住，它返回不是null而是object

从技术的角度上讲，函数在ECMAScript中是对象，不是一种数据类型，属于对象，在就是里万物皆对象的，但是，函数也确实有一些特殊的属性，因此通过typeof操作符来区分也是有必要的；

typeof 的返回值是一个字符串类型的数据：

typeof 检测任何数据，返回的都是一个字符串，两次和两次以上的连续 typeof 结果肯定都是string；

即，typeof 的 typeof 类型是字符串

console.log(typeof typeof 222);         //"string"

变量是没有类型的，只有值才有，变量可以随时持有任何类型的值

在变量执行typeof操作时候，得到的结果并不是该变量的类型，而是该变量持有值的类型；

var a = 18;
console.log(typeof a);//"number"

a = true;
console.log(typeof a)//"boolean"

总结：

• JS的核心语言特性在ECMAScript中定义的；ECMAScript包含了所有基本用法，操作符，数据类型，以及完成基本的计算任务所必须的对象；但是没有对取得输入和产生输出的机制做出规定；

• 数字类型，包含：正数、负数、零、小数、以及特殊的NaN；

• typeof：检测数据类型的运算符；返回的结果是一个字符串；里面包含了对应的数据类型；例如”object”在JS中typeof null的结果也是object；

• Instanceof：检测某一个实例是否属于这个类；在类的继承中检测的不是很严谨；

2. 字符串 string

引号内的任何东西都是字符串

字符串一旦被创建，其值是不能改变的，若要改变必须销毁原有字符串，然后用另一个包含新值的字符串填充改变量；

toString()

• 把别的类型数据，转为字符串
• 适用类型 Number/Boolean/String/Object

var testNum = 1;
console.log(typeof testNum);//number
var testTarget1 = toString(testNum);
var testTarget2 = testNum.toString();//推荐用法
var testTarget3 = String(testNum);

最后这三个都是字符串类型

String()

• null
• undefined
• null和undefined没有toString方法，所以转换的时候用String()函数；

var testNull = null;
console.log(typeof testNull); //object    【值为null的数据类型是对象】

//var testString2=testNull.toString();//Uncaught TypeError:Cannot read property 'toString' of null

var testString3 = String(testNull);  // 【用String方法把null值转换成字符串】
console.log(typeof testString3); //string

eval()

• 计算字符串表达式的值并以数值形式返回；

如果把某个数据转化为字符串，可以有一个快捷的方式，就是把它与一个字符串”“相加就可以了；

字符串类型的数字，如果前面放+会隐式调用parseFloat，将字符串快速转换为数字；

💡string的所有方法，都是不会改变原有字符串的，比如toUpperCase返回的值，其实是一个新字符串，原有字符串不变，这就是string方法的原理；

3. 数字 number

数字类型包含：正数、负数、零(0/-0/+0)、小数、以及特殊的NaN；

NaN -> Not a Number 不是一个数，但是属于数字类型；

NAN

• 含义：

  • Not a Number，
  • 非数值，不是一个数值，但是NaN属于数值类型；

  console.log(10-"abc"); //NaN   Not a Number 【输出值不是数字】
  
  var NaNVal = 10-"abc";
  console.log(typeof NaNVal); //number NaN是number类型  【但是数据类型是数字】
  
  console.log(NaNVal==NaNVal);//false 自己和自己都不相等，因为NaN代表的是不是一个数，属于一个集合的统称；
  console.log((22*"aa")==(22*"bb"));//false
  console.log((22*"aa")==22);//false
  

• 特点

  • 任何涉及NaN的操作都将返回NaN
  • NaN与任何数值都不相等包括其自身

• 检测 isNaN（程序提问：它不是一个数，对不对？）

  • 回答true / false

数值转换

• Number() 最“认真”的转换方法，只要不是纯数值类型，全部不能成功转换；
• parseInt() 是Number的升级版本；有字符串出现也可能转换为数值；从前往后开始转，只要有一位可以转为数字都可以成功转换为数字；123sad可以转为123；（备注:会忽略浮点号；遇到第一个非数值的符号后直接退出转换,其中”.“也是不合法的数值符号）
• parseFloat() 属于parseInt的升级版本；可以转换为浮点数123.12dw可以转换为123.12；

4. 布尔 boolean

注意：布尔类型的是小写 true 为真，flase 为假

大写是标识符 True

逻辑与 &&，逻辑或||

💡为 false 值的是：false 本身、空字符串、0、NaN、null、undefined；这些值要记住，很重要；

console.log("---------------------------------");
console.log(Boolean(0));    //false
console.log(Boolean(-0));    //false
console.log(Boolean(1));    //true
console.log(Boolean(-5));   //true
console.log(Boolean("222"));//true
console.log(Boolean(''));   //false  空的字符串
console.log(Boolean(" "));  //true 包含空格的字符串
console.log("---------------------------------");
console.log(