Biến mặc định trong SASS

Trong một số trường hợp, nếu giá trị của biến chưa được xác định, nhưng lại cần sử dụng trong mã, chúng ta có thể đặt cho nó một giá trị mặc định, theo sau là dấu hiệu !default.

Cần lưu ý rằng nếu biến đã được gán giá trị trước đó, thì giá trị đó sẽ được giữ nguyên, nhưng nếu chúng ta tạo một biến mới trống, thì giá trị mặc định sẽ được chỉ định cho nó.

$name: "John";
$name: "Bob" !default;
$new_name: "Mark" !default;

#main {
	name: $name;
	new_name: $new_name;
}

Kết quả biên dịch của mã được cung cấp sẽ là như sau:

#main {
	name: "John";
	new_name: "Mark";
}

Nếu chúng ta đặt giá trị của biến là null, !default sẽ coi nó như là không có giá trị:

$name: null;
$name: "Bob" !default;

#main {
	name: $name;
}

Sau khi biên dịch, chúng ta sẽ thấy:

#main {
	name: "Bob"; 
}