1.js借鉴了c及c语言，
2.区分大小写, 结尾 ';' 需加上，虽不是必须的，但在压缩会报错，增进性能
3.变量命名
(采用驼峰命名，userName) 开头（字母 $ _） 中间部分（字母，数字 $ _）
4.注释
// 单行注释
/*
* 多行注释
*
*/
5.严格模式
function(){
"user strict" // 告诉js引擎切换到严格模式
// 函数体
}
6.js变量 （是松散类型的，可以保存任何类型的数据）
使用typeof 可识别数据类型 typeof '123' // string
基本数据类型值
基本数据类型
undefined // 未申明定义 派生自null
null // 未定义的对象 表示空对象指针，用来初始空对象
string // 字符串 转字符串 '123'.toString() [正常使用这个，性能考虑] 123+'' 常用方法链接
number // 数字 NaN 非数值但为number类型 1+'ab' = NaN 判断是否为数字 isNan(123) // false
字面量格式：八进制 070 // 56 十进制 十六进制
浮点数和整数 0.3 3e-2 / 0.03 3e5 / 300000 3*10*5
数值范围 5e-324 1.79769313482623157e+308
常使用 转换 parseInt('123') （不常用 ：Number() 可转换任何类型数据 parseFloat() 浮点数转换）boolean // 布尔 true/false 逻辑判断时 1 '123' 为true ， 0 '' undefined null 为false
复杂数据类型
object
引用数据类型值 （对象 数组 函数）
A 对象
let obj = {name:'张三', age:18,01:21};
let name = obj.name; // 张三
let ages = 'age'
let age = obj[ages]; // 18 如果为变量 则使用 [变量]
let a01 = obj[01]; //21. obj.21 会报错，对象中可用数字作为属性，取值[]
正常情况 使用 '.属性'（建议使用），如果需要使用变量 则使用 ['属性']
obj.age = 20; // 重新赋值age
if(typeof obj.age){} // typeof 用来判断是否存某个属性
B 数组 方法链接
let arry = ['张三',123,true,{age:10},undefined]; // 数组下标是从0开始
let name = arry[0]; // 获取数组值，通过[]张三
arry[3] = {age:200}; // 数组重新赋值之后 ['张三',123,true,{age:200},undefined]
数组常用方法
C 函数
function demoWay(a,b){
// demoWay 实参
// arguments 实数
console.log('这里是进行打印')；
}
命名函数 var a = function b (){}
匿名函数(一般常用) var a = function(){}
8.获取元素的常用方法
document.getElementsById('wrap'); // <div id='wrap'></div>
getElementsByClassName('info'); // 不兼容ie8以下 <div class='info'></div>
getElementsByTagName('p'); // <p></p>
getElementsByName('main'); // <div name='main'></div>
9. 操作各种样式
内部样式
<style id='sty'></style>
let osty = document.getElementsById('sty');
osty.innerHTML = "#wrap{height:200px; width:200px; background:red}"；// style也属于html标签（很少使用）
行内样式
<style>
#wrap.main{background:yellow; font-weight:600};
</style>
<div id = 'wrap' myname='alia'></div>
let owrap = document.getElementsById('wrap');
改变属性值 owrap.属性值（应为合法的属性才有效，例 title id className 与保留值class类似）
owrap.id = 'one-wrap'; // 改变了id值， 对象是不变的，owrap 还有效
改变自定义标签属性值
setAttribute('myname','alia2'); // 单个 setAttribute({'name1':'n1','name2':'n2'});
getAttribute('myname'); removeAttribute('myname');
改变样式
owrap.style.height='100px'; // 单个行内样式；
owrap.style.cssText += "height:200px; color:blue"; // += 样式不会被覆盖
owrap.className = 'main'; // 通常写好样式，改变calss名称进行改变样式，样式不会出现不兼容问题
10 获取标签值，改变标签值
owrap.innerHTML = '<strong>这里是内容</strong><i>附加内容</i> \t哈哈哈';
// 可识别标签 这里是内容 哈哈哈 \ 作为转义符（一般用于特殊符号）
owrap.innerText = '<strong>这里是内容</strong><i>附加内容</i> \t哈哈哈'；
// <strong>这里是内容</strong> 不能识别标签
<input value='我是好人' class='user-name' />
document.getElementsByClassName('user-name').value('我不是好人')； // 赋值 取值直接value()
11 运算符与拼接 + - * / %
10/3 // 3.13333
10%3 // 1 % 模 相当于余数
隐式类型转换
1+2+'8'; // 38
1+2+'8'+1+2 // 3812 字符串后有数字 会先把数组转为字符串进行累加
1+true // 2 与布尔类型累加，会先转数字类型再进行累加， true 1 false 0
- * / % 会把字符串先 Number() 转之后再进行运算
'20'-'5' = 15;
'20p' - '5' = NaN;
11 自增 自减
a++ 先执行后自加 ++a 先自加再执行 let a = 10; let b = a++; // b: 10 let b = ++a; // b: 11
a-- 先执行后自减 --a 先自减再执行 let a = 10; let b = a--; // b: 10 let b = --a; // b: 9
12 运算符
if ( true && false) // false， 只要有一个假为假
if(true || false) // true 只要有一个真为真
if( ! true) // false 取反
let a = 1 && 0 && 2 // 0 一直向后取值，当遇到假停止，并取当前值，如若没有假值则取最后一位
let a = 1 || 0 || 2 // 1 一直向后取值，当遇到真停止，并取当前值，如若没有真值则取最后一位
let a = !0 // true 去数据相对应的布尔值 （相对应的false值： undefind null 0 '' Nan false ）
13 运算符优先
. [] () // 一般用于取值 数组对象
++ -- ！ typeOf()
* / %
+ -
>= <= > <
&&
||
, // let a = (1,2,3,4); 结果为4 ‘，’取最后一位，
例子：
let b = 4
let a = 10 || 8 && (b=5); // a10, b 4 先进行计算 && ，取false，无false值，取b=5, 10|| (b=5), || 取 true值，10，不进行执行b=5；
let c = !b + 5; // 5 !b = false -> false+5 -> 0+5 = 5;
let d3 = (2,10 && 0 || 8 && !5); // false ->(2, 0 || !5) ->(2,!5) -> (2,false) -> false
12 es 6 拼接 反义符
let a = 'zhang';
'<p>
<a>点击${name}</a>
</p>
7.判断
var age = 19;
// 三元运算（三目运算）
age>18 ? (a='成年人',b='18岁以上') : (a='未成年人',b='18岁以下');
网友评论