javascript我走过的坑 技术积累记录之上篇

在身边的朋友,有一些是刚踏入攻城狮行业,第一次接触的就是前端;有一些是从嵌入式应用软件转行到web前端开发,或是从嵌入式底层驱动转入;更常见的还有从后端转前端,等等。无论是从哪里进来的前端,都是从入门、基础学起,从前端三法宝(JavaScript,CSS,HTML)。在这里,给大家分享下“javascript我走过的坑?”,因为篇幅较长,分两篇来总结分享。

更多精彩内容请看web前端中文站
www.lisa33xiaoq.net 可按Ctrl + D 进行收藏

1、六种数据类型

Int,String,Object,Undefined,Arry,Bool

2、隐式转换

巧用+/-规则转换类型:

Num-0 转换成数字 Num+”” 转换成字符串

类型不同,尝试类型转换和比较(a == b):

“1.23” == 1.23

0 == false

Null == undefined

new Object() == new Object()

[1,2] == [1,2]

a ===?b :类型不同:

返回false

类型相同:

null === null

Undefined === undefined

NaN ≠NaN

new?Object ≠new Object

3、包装对象

Javascript会将基础类型string num Boolean临时转化为相对应的类对象,可以操作属性,比如str.length,也可以赋值,但是调用结束之后,相应的类对象就消失了,比如str.t=4,alert(str.4)却为undefined。

JavaScript基础知识

JavaScript基础知识

4、类型检测

typeof判断基本类型和函数对象,遇到null失效

Instanceof 适合自定义对象,也可以用来检测原生对象,不同window或iframe间的对象类型检测不能使

   Object.prototype.toString //适合内置对象和基元类型
   Constructor
   duck type
   typeof null === “object”
   //左边的左操作数对象的原型链上是否有右边构造函数的prototype属性。
   obj instanceof Object:
   Object.prototype.toString.apply([]); === "[object Array]";
   Object.prototype.toString.apply(function(){}); === "[object Function]";
   Object.prototype.toString.apply(null); === "[object Null]";
   Object.prototype.toString.apply(undefined); === "[object Undefined]";
   //www.lisa33xiaoq.net
   IE6/7/8   Object.prototype.toString.apply(null); === "[object Object]";

5、表达式

表达式是一种JS短语,可使JS解释器用来产生一个值。——《JS权威指南》

原始表达式
初始化表达式
函数表达
属性访问表达式
调用表达式
对象创建表达式

原始表达式:

常量、直接量: 3.14?“test”

关键字: null this ture

变量: I,k,j

属性访问表达式

var?o = {x:1}; o.x o[‘x’]

?6、运算符

delete运算符
var obj = {x:1};
obj.x;      //   1
delete obj.x;
obj.x;     //   undefined
var obj = {};
Object.defineProperty(obj,’x’,{
	configurable: false
	value : 1
});
delete obj.x;   // false
obj.x;        //1
只有configurable是true,才可以delete
typeof 100 === ‘number’    // true

?7、块语句和var语句

没有块级作用域。例如:

for (var i = 0;i<10;i++){
 var str = “hi”;
 console.log(str);
}
Console.log(i);     //  10

声明变量语句:

foo:

var a=b=1 确实创建了a和b,且赋值位1,但是b被隐私创建位全局变量。

8、函数等其他语句

函数声明:会被预先处理(函数前置)

fd();  // true
function fd(){
	// do sth.
    return
}
函数表达式:
Fe();  //TypeError
var fe = function(){
	// do sth.
}
for…in 语句://1,顺序不确定
//2,enumerable为false时不会出现
var p;
//3,for in对象属性时受原型链影响
var obj = {x:1,y:2}
for (p in obj){
}

With语句可以修改当前的作用域,但现在不建议使用

·让JS引擎优化更难

·可读性差

·可被变量定义代替

·严格模式下被禁用

9、严格模式

严格模式是一种特殊的执行模式,它修复了部分语言上的不足,提供更强的错误检查,并增强安全性。

进入严格模式的方法:

function func(){

‘use strict’;

}

整个函数类是严格模式,同时可以向上兼容,如果浏览器不支持严格模式,只会被当成普通字符串,并且被忽略

‘use strict’;

function func(){

}

指定整个JS文件内是严格模式

不允许使用with,会报SyntaxError

不允许未声明的变量被赋值, ReferenceError

arguments变为参数的静态副本

delete参数、函数名报错 SyntaxError

delete不可配置的属性报错 TypeError

对象字面量重复属性名报错 SyntaxError

禁止八进制字面量 SyntaxError

eval,arguments变为关键字,不能作为变量、函数名 SyntaxError

eval独立作用域

10、对象

对象中包含一系列属性,这些属性是无序的。每个属性都有一个字符串key和对应的value。

function foo(){}   //函数对象会默认带prototype属性,是对象属性
foo.prototype.z = 3;

var obj = new foo();
obj.y = 2;
obj.x = 1;

obj.x;     //1
obj.y;     //2
obj.z;   //3
typeof obj.toString;     //  ‘function
‘z’ in obj;   //true
Obj.hasOwnProperty(‘z’);   //false
obj.z = 5; //不会改变原型链的值,不会向原型链上查找,仅在对象上修改或添加值

Obj.hasOwnProperty(‘z’); ??//true
foo.prototype.z; //still 3
obj.z; //5
obj.z = undefined;
obj.z; ???// undefined
delete obj.z; // true
obj.z; // 3
delete obj.z; // true 
obj.z; ??// still 3!!!! 只会删除掉delete对象上的属性,不会影响到原型链

11、属性操作

Var obj = {x:1};
obj.y; ??//undefined
vary z = obj.y.z ??// TypeError: Cannot read property ‘z’ of undefined
obj.y.z = 2; ?// TypeError: Cannot set property ‘z’ of undefined

有些属性不允许被删除:

delete Object.prototype; ?// false

var定义的全局变量和局部变量不能被删除

函数声明,不管是全局函数还是局部函数都不能删除。

使用Object.definePropety()创建,若不特殊标明enumerable,则默认为false

function foo(){}
Object.defineProperty(foo.prototype,’z’, {get:function(){retrun 1;}});
var obj = new foo();
obj.z;   // 1
obj.z = 10;   
// obj没有z属性时,原型链向上查找发现有对应的set或get方法,
//尝试赋值时,会走原型链上的get或set方法,不会按照给当前对象添加新属性的方式处理。
obj.z;   //  still 1 

如何修改呢?

Object.defineProperty(obj,’z’,{value:100,configurable:true});
obj.z;  // 100
delete obj.z;  
obj.z;  // back to 1

相似的:

Var o = {};
Object.defineProperty(o,’x’,{value : 1});  // writable = false  configurable=false
var obj = Object.create(o);
obj.x;  // 1
obj.x = 200;
obj.x; // still 1 ,can’t change it

修改方法:

Object.defineProperty(obj,’x’,{writable:true, configurable:true,value : 100});
obj.x;  // 100
obj.x = 500;
obj.x; // 500

web前端中文站点评

至此,给大家分享完JavaScript需要注意的一些知识上篇,后面会继续更新下篇,希望大家能继续学完。

 

3
如无特殊说明,文章均为原作者原创,转载请注明出处

该文章由 发布

这货来去如风,什么鬼都没留下!!!
发表我的评论

Hi,请填写昵称和邮箱!

取消评论
代码 贴图 加粗 链接 删除线 签到